* { margin: 0; padding: 0;}

body{background-color: #EFF5FC; font-size: 12px; padding-top: 50px;}

.font-12 { font-size: 12px!important; }
.font-13 { font-size: 13px!important; }
.font-14 { font-size: 14px; }
.font-15 { font-size: 15px; }
.font-16 { font-size: 16px!important; }
.font-18 { font-size: 18px; }
.font-20 { font-size: 20px; }
.font-22 { font-size: 22px; }
.font-24 { font-size: 24px; }
.font-28 { font-size:28px; }
.font-30 { font-size: 30px; }

.bg-dark { background-color: #013566!important; }
.bg-dark-blue { background-color:#003D75!important; }
.text-blue { color: #117AEF; }
.btn-dark-gray { background-color: #737789; color: #fff!important; }
.bg-secondary { background-color: #7B7B7B; color: #fff!important; }
.text-grey { color: #7C7C7C;  }
.text-dark-blue { color:#003D75;  }
a { color: #117AEF; }
a:hover { color: #117AEF;  }
.form-control::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color:#A7A7A7;
}
.form-control::-moz-placeholder { /* Firefox 19+ */
 color:#A7A7A7;
}
.form-control:-ms-input-placeholder { /* IE 10+ */
color:#A7A7A7
}
.form-control:-moz-placeholder { /* Firefox 18- */
color:#A7A7A7
}

/*******************************
* MODAL AS LEFT/RIGHT SIDEBAR
* Add "left" or "right" in modal parent div, after class="modal".
*******************************/
	.modal.left .modal-dialog,
	.modal.right .modal-dialog {
		position: fixed;
		margin: auto;
		width:280px;
		height: 100%;
		-webkit-transform: translate3d(0%, 0, 0);
		    -ms-transform: translate3d(0%, 0, 0);
		     -o-transform: translate3d(0%, 0, 0);
		        transform: translate3d(0%, 0, 0);
	}

	.modal.left .modal-contentt, .modal.right .modal-content {	height: 100%; overflow-y: auto;	}
	
	.modal.left .modal-body,.modal.right .modal-body {	padding: 15px 15px 80px;}
	#navDetails .modal-body {	height:calc(100vh - 69px);	overflow-y: auto;}

/*Left*/
	.modal.left.fade .modal-dialog{
		left: -280px;
		-webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
		   -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
		     -o-transition: opacity 0.3s linear, left 0.3s ease-out;
		        transition: opacity 0.3s linear, left 0.3s ease-out;
	}
	
	.modal.left.fade.in .modal-dialog, 	.modal.left.fade.show .modal-dialog{left: 0; width:80%;	}
        
/*Right*/
	.modal.right.fade .modal-dialog {
		right: -100%; width:100%;
		-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
		   -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
		     -o-transition: opacity 0.3s linear, right 0.3s ease-out;
		        transition: opacity 0.3s linear, right 0.3s ease-out;
	}
	
	.modal.right.fade.in .modal-dialog, .modal.right.fade.show .modal-dialog {right: 0;	}

/* ----- MODAL STYLE ----- */
	.modal-content {border-radius: 0;border: none;}
	.modal-header {	border-bottom-color: #EEEEEE;	background-color: #FAFAFA;	}
 


/*modal bottom*/
	.modal.bottom .modal-dialog {
		position: fixed;
		margin: auto;  bottom: 0; 
		width:100%;
		height: 100%;
		-webkit-transform: translate3d(0%, 0, 0);
		    -ms-transform: translate3d(0%, 0, 0);
		     -o-transform: translate3d(0%, 0, 0);
		        transform: translate3d(0%, 0, 0);
	}

	.modal.bottom .modal-body  {	height: 100%; overflow-y: auto; max-height: calc(50vh - 0px);     min-height: calc(42vh - 0px);	}
	
 .modal.bottom .modal-content {
    border-radius: 15px 15px 0 0;
    box-shadow: 0 3px 14px rgba(0,0,0,.15)!important;
    position: fixed;
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
}
	 

/*Left*/
	.modal.bottom.fade .modal-dialog{
		bottom: -100%;
		-webkit-transition: opacity 0.3s linear, bottom 0.3s ease-out;
		   -moz-transition: opacity 0.3s linear, bottom 0.3s ease-out;
		     -o-transition: opacity 0.3s linear, bottom 0.3s ease-out;
		        transition: opacity 0.3s linear, bottom 0.3s ease-out;
	}

	.modal.bottom.fade.in .modal-dialog, 	
	.modal.bottom.fade.show .modal-dialog{ right: 0; left: 0;  width: 100%;  max-width: 100%;     bottom:0px;}






 .bg-light-1 { background-color: #EFF5FC;  }

 .logoText  { text-decoration: none!important; font-size: 14px; display: flex; align-items: center; font-weight: 500; color: #007bff!important;  }
 span.logoInitial { background: #0183B3; color: #fff;  padding: 6px 5px; font-weight: normal; border-radius: 3px;     background: rgb(1,133,181);        background: linear-gradient( 270deg, #499bf3 0%, rgb(54 118 179) 100%); font-weight: 500;} 

.close { color: #013566;   outline: none!important;  }
.roundedBox {   border-radius: 0px 0 15px 15px;}
.borderColor { border-color: #A0A0A0!important;  opacity: 0.26; }
.userName {  font-weight: 500; }
.text-primary { color: #016B9C!important;  }

ul.navList li {  list-style: none;}
ul.navList li a {   display: flex; align-items: center; padding:.7rem 0; text-decoration: none; color: #696969; transition: .2s; position: relative;}
ul.navList li a span { margin-left:10px;  }
ul.navList li a:hover { font-weight: 500; color: #013566;  }

ul.navList.withBorder {  border-top: 1px solid #eee;   }
ul.navList.withBorder li {   padding: 0 1.5rem;}
ul.navList.withBorder li { border-bottom: 1px solid #eee;  }
span.notificationCount {  width: 20px; height: 20px;  background: #0183B3; text-align: center; color: #fff;   border-radius: 30px; float: right;  position: absolute;  right: 0;  top: 0;  bottom: 0;  margin: auto;}

.topBluePatch { background-color:#013566; min-height:140px; border-radius:0 0 15px 15px; padding-top:2px;}

.summaryViewFilter a { color: #fff; text-decoration: none!important;  opacity: .5; display: inline-block; padding: 3px 10px;  border-radius: 30px;  transition: .2s;}

.summaryViewFilter a.active, .summaryViewFilter a:hover {  opacity:1;  color: #013566; background-color: #fff; }
.font-weight-medium { font-weight: 500;   }


ul.routeMenu li { list-style: none;}
span.routeMenuName {  display: block; margin-top: 5px;}
ul.routeMenu li { list-style: none; margin-bottom: 10px;  }
ul.routeMenu li a {  text-align: center;  display: block;    margin: 0 .42rem;  color: #575757;  text-decoration: none!important;
    line-height: normal;  max-width: 62px;}

ul.routeMenu li a span.routeMenuImg { width: 62px; display: block;  margin: auto;  height: 58px;  line-height: 57px;  background: transparent linear-gradient(219deg, #0185B5 0%, #013566 100%) 0% 0% no-repeat padding-box; border-radius: 15px; opacity: 1;}
ul.routeMenu li a span.routeMenuImg img {  height: 30px;}
ul.routeMenu li a:hover span.routeMenuImg { background: #013566; }
ul.routeMenuInWhite li a span.routeMenuImg {  background: #fff;     box-shadow: 0 .125rem .25rem rgba(0,0,0,.075);     box-shadow: 0px 3px 6px #00000022;}
ul.routeMenuInWhite li a span.routeMenuImg img {  max-width: 30px;}
ul.routeMenuInWhite li a:hover span.routeMenuImg { background: #f4fcff; }

.itemMenuCss   img { max-height: 32px; }
span.hideItemNenu {  height:6px;  width:54px;  background:#B2B2B2; display:block;  border-radius:10px;
    margin: .5rem auto;}
  

 span.routeMenuImg { width:57px; height:53px; background:#F4F4F4; text-align:center; line-height:53px;
    border-radius: 10px;}
span.pageName { display:flex; font-size:15px; align-items:center;  justify-content:space-between;}
.pageName:after { content: ''; background: url(../images/arrow_page_redirect_icon.svg) no-repeat; height: 20px; width: 20px; display: block;}

 
ul.navList.itemMenuCss li a { font-weight: 500;  }
ul.navList.itemMenuCss li a:after { content: '';  border-bottom: 1px solid #eee;  position:absolute;    bottom: 0;   right: 0;   left: 82px;}
ul.navList.itemMenuCss li:last-child a:after { display: none;}
.customSliderContainer .owl-carousel.owl-drag .owl-item { user-select: auto;  }
.customSliderContainer .owl-carousel.owl-drag .owl-item .rounded {
    border-radius: 11px!important;     box-shadow: 0px 4px 6px rgb(0 0 0 / 12%)!important;
}
.customSliderContainer  .owl-carousel .owl-stage-outer {     margin-bottom: -15rem;   }
.tabMenu {   margin-top: 6rem;}
.customSliderContainer .owl-item { opacity: .8;  }
.customSliderContainer .owl-item.active { opacity: 1;  }

.notificationList { list-style: none;}
.notificationList li a { color: #606060; text-decoration: none; line-height: normal; font-size: 14px;}
.notificationList li { border-bottom: 1px solid #eee; padding:13px 5px;}

.top-text-block .top-text-light {  color: #A0A0A0;  font-size:12px;}
.notificationList li a strong {  color: #4D4D4D; }
.notify-img { width: 55px; height: 55px; background: #CCCCCC; overflow: hidden; border-radius: 50px; text-align: center; line-height: 55px;}
.notify-img img { max-height: 30px; }
.clearAllText  { color: #8B8B8B!important; text-decoration: none; font-weight: 500; font-size: 13px; }
.closeNotification { opacity: 1!important; }

.notificationBody {    max-height: calc(100vh - 97px);    overflow-y: auto;}
 .deleteNotification:hover {    opacity: .5;}
.bg-danger {    background-color:#FF5147!important;}

.bg-light {	background: #EFF5FC!important;}
.hideOther .searchHide { display: none; }
#searchListBox {  transition: .5s;}
span.searchWithInput {    position: absolute;    left: 15px;}
.closeSearch { right:15px;   position: absolute;     margin-top: -2px }
.line-height-normal { line-height:normal; }

label { color:#676767; font-size: 14px; }

.form-control  { font-size:14px; color: #000000; }
.btn-dark-blue { background: #003D75; color: #fff!important;}
.btn-outline-dark-blue { border: 1px solid #003D75!important; color: #003D75!important;}
.btn-light-blue { background: #0179AA; color: #fff!important;}
.btn-outline-secondary { color: #808080;     border: 1px solid #9B9B9B; }
.btn-outline-dark-blue { border-color: #003D75; color: #003D75;  }
.btn-outline-dark-blue:hover {  background: #003D75; color: #fff!important;  }
button.btn {  height: 43px; font-size: 15px; font-weight: 500;}

.customTab a {  border: none!important;  margin: 0!important; font-size: 14px; color: #3E3E3E; padding:.8rem 1rem; position: relative;}
.customTab .nav-tabs a.active {color: #003D75; font-weight: 500;   }
.customTab a.active:after {
	content: '';
	position: absolute;
	bottom:-3px; height: 0;
	border:3px solid #003D75;
	border-radius: 10px;
	background: #003D75;
	left: 0;
	right: 0;
}

.w-85  {  width: 85%;} 
.logoCenter img { max-width:100%; height:auto;}
.bg-box {
    border-radius: 8px;
    height: 38px;
    width: 38px;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    line-height: 37px;
}

.custom-control-label::before {  background-color: #CBCBCB; border: #CBCBCB solid 1px;     top: 5px;}
.custom-switch .custom-control-input:focus~.custom-control-label::before {box-shadow: none!important; outline:none!important;}

.custom-switch .custom-control-label::after {
    background-color: #007bff;
    height: 24px;
    width: 24px;
    top:-2px;
    border-radius: 30px;
    box-shadow:0px 3px 6px rgb(0 0 0 / 10%);
    border: 2px solid #fff;
	-webkit-transform: translateX(-.75rem);
    transform: translateX(-.75rem);
}

.custom-switch .custom-control-input:checked~.custom-control-label::after {
   border: 2px solid #007bff; }


  /* Account activation   */
  .custom-control-label::before {
	top: 2px;
	background-color:transparent;
    border: #9B9B9B solid 1px;
  }
  .custom-checkbox .custom-control-label::before {
    border-radius: 2px;
}
.custom-control-label::after {
	top:2px;
}

input[type="number"] {
	 
	text-align: center;
	appearance: textfield;
	-webkit-appearance: textfield; 
 color: #013566;
font-weight: 500; 
box-shadow: none!important;
padding: .375rem .25rem;
}


.actcode.form-control {
	 
	text-align: center;
	appearance: textfield;
	-webkit-appearance: textfield; 
 color: #013566;
font-weight: 500; 
box-shadow: none!important;
padding: .375rem .25rem;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.form-control.bg-light {
	border: transparent;;
}
.border-success {
	border-color:  #00CB8F!important
}
.btn-success {
	background-color:  #00CB8F!important; border-color: #00CB8F!important;
}

.boxRadius {
	border-radius: 0 0 60px 0;;
 }


 /* FI Account */

  .device .device-bezel {box-sizing: content-box;} 
 
  .body-content button {
	width: 100%;
	height: 48px;
	border-radius: 1000px;
	background: cyan;
	border: none;
	outline: none;
	margin-top: 24px;
	cursor: pointer;
  }
  
  /*.device {  }
    .device .device-viewport {}  
   .pin-info {  } 
  .pin-display { } 
  .keypad { }
   */
  .keypad--row {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;;
  }
  .keypad--button {
    height: 55px;
    display: flex;
	font-weight: 500;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    font-weight: normal; color: #013566;
    cursor: pointer;
    transition: all 100ms ease-out;
    border: 1px solid #D8D8D8;
    width: 55px;
    border-radius: 100px;
}
  .keypad--button:active {
	background: #EAEAEA;
  }
  
  .confirmation-dots { 
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
  }
  .confirmation-dots.error {
	animation-name: shake;
	animation-duration: 300ms;
  }
  .confirmation-dots svg {
	height: 20px;
	max-height: 24px;
	width: 170px;
  }
  .confirmation-dots .pin-circle {
	transition: all 100ms ease-out;
	fill: white;
	stroke-width: 1px;
	stroke: #D8D8D8;
	outline-offset: -2px;
	outline-width: 2px;
  }
  .confirmation-dots .pin-circle.entered {
	fill:#013566; stroke: #013566;
  }
  .confirmation-dots .pin-circle.success {
	fill:#00cb8f;
	stroke:#00cb8f;
  }
  .confirmation-dots .pin-circle.error {
	fill: red;
	stroke: red;
  }
  
  .circle-lock--container {
	height: 72px;
	position: relative;
	display: flex;
	justify-content: center;
	flex-direction: row;
  }
  
  .circle-lock {
	width: 80px;
	height: 80px;
	background: white;
	border-radius: 1000px;
	position: relative;
	top: -40px;
	box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.12);
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
  }
  .circle-lock .lock-icon {
	color: #333;
  }
  
 
/*   
  .pin-info {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
  }
   */
  @keyframes shake {
	10%, 90% {
	  transform: translate3d(-1px, 0, 0);
	}
	20%, 80% {
	  transform: translate3d(2px, 0, 0);
	}
	30%, 50%, 70% {
	  transform: translate3d(-4px, 0, 0);
	}
	40%, 60% {
	  transform: translate3d(4px, 0, 0);
	}
  }

  select { 
	appearance: none;
    -webkit-appearance: none;
	background: url(../images/select_arrow.svg) no-repeat 96% 8px;
	background-size: 20px;
  }

  .text-danger {
	  color: #F70000!important;
  }
  a.text-danger:hover {
	color: #F70000!important;
}


/* ------------------- */

.custom_accordion .card-header { 
	background-color: transparent;     
	padding: 1rem 1.25rem; 
	padding-left: 0; 
	border: 0; 
	margin: 0!important; 
	text-transform: uppercase; 
	font-weight: 500;  cursor: pointer;
	font-size: 14px;
	
}
.custom_accordion .card-header::after {
    content: '';
    background: url(../images/select_arrow.svg) no-repeat right center;
	transform: rotate(181deg);
    background-size: cover;
    height: 22px;
    width: 20px;
    display: inline-block;
    vertical-align: middle;
    position: absolute;
    right: 0; margin-top: -2px;
}
.custom_accordion .card-header.collapsed::after { 
	content: '';
	transform: rotate(0deg);  margin-top: 1px;
}
.custom_accordion .card-header  a { color: #003D75!important;  }

.custom_accordion .card { border-radius: 0; border: 0; }
.custom_accordion .card .card-body { padding: 0; }
.custom_accordion .card-header {   border-top: 1px solid #CCCCCC;}
.custom_accordion .card-header:first-child {    border: none;}
.line-height-normal { line-height: normal; }

.dateControl .form-control {
    padding: 0 5px;
    text-align: center;
}
.imgPlaceholder {
    height: 118px;
    display: flex;
    overflow: hidden;
}
.imgPlaceholder img {
    width: 100%;
    height: auto;
    overflow: auto;
}


.bg-light-grey {  
	background: #EBEBEB; 
}

.impAsterisk:before {
    content: ' * '; left: 0;
    position: absolute;
    color: #f00;
    font-weight: 500;
}
.impAsterisk { padding-left:6px;position: relative; display: flex; }
.searchIconplaceholder { background: url(../images/search_DarkGrey_Icon.svg) no-repeat 96%; background-size: 16px; }
.rounded-11 { border-radius: 11px; }
.mb-n55 {     margin-bottom: -5.5rem;}
.shadow-sm-xd { 
	box-shadow: 0px 4px 6px rgb(0 0 0 / 12%);
}
.customTable table {     border-collapse: separate;    border-spacing: 0px 1px;}
.customTable table tr th {     vertical-align: top; font-weight: 500;}
.customTable table tr td {    color: #363636;     padding:.9rem .75rem; }
.customTable table tr:nth-child(even) { background-color: #EFEFEF;}
.customTable table tr:hover {box-shadow: 0px 3px 3px #00000029; }


.otpControl .form-control { margin: 0 2px; text-align: center;  border: none; padding: 0; font-size:28px; height: 38px; border-radius: 0;  border-bottom: 1px solid rgba(0,0,0,.1); }


.sepratOr {
    border-bottom: 1px solid #EBEBEB;
    text-align: center;
}

.sepratOr span {
    background: #EBEBEB;
    color: #7C7C7C;
    font-weight: 500;
    width: 25px;
    height: 25px;
    display: inline-block;
    line-height: 24px;
    text-align: center;
    border-radius: 30px;
    position: relative;
    top: 12px;
    margin: auto;
    font-size: 11px;
}


/* For individual collection */

.methods a {
    background: #E8E8E8;
    color: #117AEF;
    display: inline-block;
    padding: .625em 1rem;
    border-radius: 2px;
	margin:2px 4px;
}

.customTab_buttons li.nav-item {
    margin: 0;
	-ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
}

.customTab_buttons li.nav-item a {
    border: 1px solid #989898;
    border-radius: 2px;
    color: #000000; font-size: 14px;
    padding: .599rem 1rem;  text-align: center;
	margin: 2px 5px;
}
.customTab_buttons li.nav-item a:hover { 
	border-color:#003D75; color: #003D75;
}
.customTab_buttons li.nav-item a.active {
	color: #fff;
	background: #003D75; border-color:#003D75;
}


.customeTab_withIcon li.nav-item {
    margin: 0;
}

.customeTab_withIcon li.nav-item a {
    border: none;
    color: #7B7B7B!important;
    display: flex;
    font-size: 13px;
    padding: 0;
    align-items: center; margin-right: 1rem; overflow: hidden;
}
.tab_icon {
    width: 40px;
    height: 40px;
    display: inline-block;
    vertical-align: middle;
    border: 1px solid #003D75;
    border-radius: 8px;
    margin-right: 5px;
}
.noteCount_icon {
    background: url(../images/cash_darkBlue_Icon.svg) no-repeat center;
}
.lca_icon {
    background: url(../images/rs_darkBlue_Icon.svg) no-repeat center;
}

.customeTab_withIcon li.nav-item a.active .noteCount_icon {
    background: url(../images/cash_white_Icon.svg) no-repeat center;
	background-color:#003D75 ;
}

.customeTab_withIcon li.nav-item a.active .lca_icon {
    background: url(../images/rs_white_Icon.svg) no-repeat center;
	background-color:#003D75 ;
}

.upiDIv {
    border: 1px solid #ACACAC;
    border-radius: 4px;
}

.bg-light-grey-1 { background: #EFEFEF ;
	border-radius: 4px;}

	.locationsearch {
		position: absolute;
		top: 0;
		left: 15px;
		right: 18px;
		margin: 10px 0;
		box-shadow: 0px 3px 6px rgb(0 0 0 / 16%);
		border-radius: 4px;
	}

	.bg-light-grey { background-color: #F5F5F5; }
	.border-dark-blue {  border-color: #003D75!important;}
	.searchFilters .nav li {
		margin: 0!important;
		display: table-cell;
	}
	.searchFilters .nav li a {
		border: 1px solid #C9C9C9;
		border-radius: 3px;
		color: #4D4D4D;
		margin: 3px;
	}
	.searchFilters .nav li a.active { border: 1px solid #117AEF; background-color: #117AEF; color: #fff; }


	
.accountSyncedList { list-style: none;}
.accountSyncedList li a { color: #606060; text-decoration: none; line-height: normal; font-size: 14px;      width: 100%;    position: relative;}
.accountSyncedList li { border-bottom:1px solid rgba(160, 160, 160, .23); padding:15px 0px;}
.accountSyncedList li:last-child { border: none;  }
.tickIcon { 
	width:13px;
	height:13px;
	background: url(../images/circle_grey_Icon.svg) no-repeat;
	display: inline-block;
	position: absolute;
	right: 0;
	top: 5px;
}

.accountSyncedList li .bg-box {
    width: 68px;
    height: 63px;
    background: #000;
    text-align: center;
    line-height: 66px;
    border-radius: 15px;
}

	.accountSyncedList li .badge {
		margin-top: 2px;
		display: inline-block;
		font-weight: 500;
		color: #5F5F5F;
		border-radius: 10px;
		background: #DBDBDB;
		padding: 4px 10px;
		letter-spacing: .5px;
	}

	.accountSyncedList li a .top-text-heading { font-weight: 400; color: #000; }
	.accountSyncedList li.selected  .badge { background-color:rgba(12, 181, 64, .34); color: #00962E; }
	.accountSyncedList li.selected  .tickIcon { background: url(../images/circle_green_Icon.svg) no-repeat; }
        
/*        .modal-backdrop {
@import "common.css";
            display: none;
        }*/

#providerQRCode{
    max-width: 90%;
    min-width: 50%;
    max-height: 90%;
    min-height: 50%;
}

.overlay{
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 999;
    background: white;
    text-align: center;
    align-content: center;
}
body.loading{
    overflow: hidden;   
}
body.loading .overlay{
    display: block;
}