body {
  font-family: 'Open Sans', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  
  font-size: 14px;
  line-height: 1.42857143;
  color: #354463;
  /* background-color: #ffffff;; */
  background-color: #eff1f6;
}

p {
  font-size: 1.1em;
  font-weight: 300;
  line-height: 1.4em;
}

a,
a:hover,
a:focus {
  color: inherit;
  text-decoration: none;
  transition: all 0.3s;
}
label{
    font-weight: 500;
}
.form-group label{
	font-weight: 700;
}
a.boldlink{
	display: block;
    color: #337ab7;
    padding: 5px 0;
    font-weight: 600;
    text-decoration: underline;
}
.bg-blue{
  background-color: #007bff !important;
}
.bg-green{
  background-color: #28a745 !important;
}
.bg-red{
  background-color: #dc3545 !important;
}
.bg-yellow{
  background-color: #ffc107 !important;
}
.bg-cyan{
  background-color: #17a2b8 !important;
}
.bg-grey{
  background-color: #6c757d !important;
}
.bg-pink{
  background-color: #FF1493 !important;
}
.bg-disabled{
	opacity: 0.4;
	pointer-events: none;
}
.cb{
	color: #0369dd;
}
.no-bor{
	border: none !important;
}
.d-ib{
	display: inline-block;	
}
.d-fx{
	 display: flex;	
}
.d-fx-1{
	-ms-flex: 1;
	flex: 1;
}
.d-fx-2{
	-ms-flex: 2;
	flex: 2;
}
.jc-c {
	justify-content: center;
}
.jc-sb {
	justify-content: space-between;
}
.fxd-c {
	 flex-direction: column;
}
.ai-b {
	align-items: baseline;
}
.ai-s {
	align-items: flex-start;
}
.ai-e {
	align-items: flex-end;
}
.fs-16{
	font-size: 16px;
}
.fs-14{
    font-size: 14px !important;
}
.fs-18{
	font-size: 18px;
}
.fw-b{
	font-weight: bold !important;
}
.fw-5{
	font-weight: 500 !important;
}
.fw-7{
	font-weight: 700 !important;
}
.ht-250{
	height: 250px;
}
.ht-300{
	height: 300px;
}
.m-15{
	margin: 20px;
}
.m-20{
	margin: 20px;
}
.mb-15{
	margin-bottom: 15px;
}
.mb-20{
	margin-bottom: 20px;
}
.mb-40{
	margin-bottom: 40px;
}
.mb-0{
	margin-bottom: 0 !important;
}
.mt-5{
	margin-top: 5px !important;
}
.mt-10 {
	margin-top: 10px !important;
}
.mt-20{
	margin-top: 20px;
}
.mt-n10{
	margin: -10px !important;
}
.mlr-0{
    margin-right: 0px;
    margin-left: 0px;
}
.mr-10{
	margin-right: 10%;
}
.mr-5{
	margin-right: 5px;
}
.mr-20{
	margin-right: 20px;
}
.mr-40{
	margin-right: 40px;
}
.ml-10{
	margin-left: 10%;
}
.ml-23
{
	margin-left:23px;
}
.ml-auto{
	margin-left: auto;
}
.mr-auto{
	margin-right: auto;
}
.ml-4{
	margin-left: 4px;
}
.tableAdmin td.no-pad,
.no-pad{
	padding: 0px !important;
}
.or-auto{
	overflow: auto;
}
.orx{
	overflow-x: auto;
}
.ory{
	overflow-y: auto;
}
.pd-10{
	padding: 10px !important;
}
.pd-20{
	padding: 20px !important;
}
.pdl-2{
	padding-left: 2px;
}
.pdl-15{
	padding-left: 15px;
}
.pdl-20{
	padding-left: 20px!important;
}
.pdr-20{
	padding-right: 20px;
}
.pdl-25{
	padding-left: 25px;
}
.pdb-0{
    padding-bottom: 0  !important;
}
.pl-0
{
	padding-left: 0px;
}
.plr-0{
    padding-right: 0px;
    padding-left: 0px;
}
.pt-0{
	padding-top: 0px  !important;
}
.pt-5{
	padding-top: 5px;
}
.pt-10{
	padding-top: 10px;
}
.pt-15{
	padding-top: 15px;
}
.pt-20{
	padding-top: 20px;
}
.pb-10
{
	padding-bottom: 10px;
}
.pb-20
{
	padding-bottom: 20px;
}
.text-cap{
	text-transform: capitalize;
}
.text-upper{
	text-transform: uppercase;
}
.text-lower{
	text-transform: lowercase;
}
.w-a{
    width: auto !important;
}
.w-10{
    width: 10px !important;
}
.w-20{
    width: 20px !important;
}
.w-30{
    width: 30px !important;
}
.w-40{
    width: 40px !important;
}
.w-50{
    width: 50px !important;
}
.w-60{
    width: 60px !important;
}
.w-70{
    width: 70px !important;
}
.w-80{
    width: 80px !important;
}
.w-150{
    width: 150px !important;
}
.w-200{
    width: 200px !important;
}
.w-250{
    width: 250px !important;
}
.w-300{
    width: 300px !important;
}
.w-360{
	width: 360px !important;
}
.sw-150.bootstrap-select{
	width: 140px !important;
}
.sw-300.bootstrap-select{
	width: 300px !important;
}
.w-auto{
	width: auto;
}
.w-100p{
	width:100%;
}
.w-20p{
	width:20%;
}
.w-25{
	width:25%;
}
.w-mx400{
	max-width: 400px;
}
.w-br{
	word-break: break-word;
}
.w-brAll{
	word-break: break-all;
}
.mh-34{
	min-height: 34px;
}
.input-group-addon{
	background-color: #fff;
}
.input-group .form-control{
	border-right: 0;
}
.input-group .form-control.bor{
	border: 1px solid #ccc;
}
.form-control{
	color: #354463;
}
.pointer{
    cursor: pointer;
}
.divider{
	background-color: #cccccc;
    border: 0;
    color: #eee;
    height: 1px;
    margin: 20px 0;
}
.blue{
  color: #007bff !important;
}
.active-status,
.approve,
.approved,
.green{
  color: #28a745 !important;
}
.blocked-status,
.reject,
.rejected,
.red{
  color: #dc3545 !important;
}
.pending{
  color: #fa7f05 !important;
}
.pending_btn, .btn-tdsPending{
	color: #fa7f05 !important;
	background-color: #ffefdb;
    padding: 5px 20px;
    border-radius: 5px;
    text-align:center;
}
.rejected_btn{
	color: red !important;
	background-color: #ffd8d8;
    padding: 5px 20px;
    border-radius: 5px;
    text-align:center;
}
.approved_btn, .btn-approved{
	color: #10d195 !important;
    background-color: #ddfdf4;
	padding: 5px 20px;
    border-radius: 5px;
    text-align:center;
}
.yellow{
  color: #ffc107  !important;
}
.cyan{
  color: #17a2b8 !important;
}
.grey{
  color: #6c757d !important;
}
.pink{
  color: #FF1493 !important;
}
.not_applicable{
  color: #6e7d95  !important;	
}
.not_dispatched{
  color: #a78a29 !important;
}
.not_applicable_btn{
	color: #6e7d95 !important;
    background-color: #cddae0;
    padding: 8px 5px;
    border-radius: 5px;
}
.not_dispatched_btn{
	color: #a78a29 !important;
    background-color: #fff2c6;
    padding: 8px 5px;
    border-radius: 5px;
}
.delivered_btn{
	color: #10d195 !important;
    background-color: #ddfdf4;
    padding: 8px 5px;
    border-radius: 5px;
}
.dispatched_btn{
	color: #ff6e14 !important;
    background-color: #ffefdb;
    padding: 8px 5px;
    border-radius: 5px;
}
.approved_btn{
	color: #10d195 !important;
    background-color: #ddfdf4;
    padding: 8px 5px;
    border-radius: 5px;
}
.loading-overlay {
  display: none;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  z-index: 9998;
  align-items: center;
  justify-content: center;
}
.loading-overlay.active {
  display: flex;
}
.scroll-theme::-webkit-scrollbar {
  width: 8px;
}

/* Track */
.scroll-theme::-webkit-scrollbar-track {
  background: #f1f6fd; 
  margin-top:10px;
  border-radius: 10px;
}
 
/* Handle */
.scroll-theme::-webkit-scrollbar-thumb {
  background: #d9e5f7; 
 border-radius: 10px;
}

#alertMsg{
  top: auto;
  font-size: 16px;
  z-index: 99999;
}
#alertMsg .modal-header{
  border-bottom: none;
  text-align: center;
}
#alertMsg.success .modal-content{
  color: rgb(0, 56, 40);
  background-color: rgb(229, 243, 239);
}
#alertMsg.error .modal-content{
	color: rgb(101, 24, 30);
	background-color: rgb(254, 235, 237);
}
#alertMsg .glyphicon{
	display: inline-block;
	padding-right: 10px;
}
#alertMsg.success .glyphicon-exclamation-sign{
	display: none;
}
#alertMsg.error .glyphicon-ok-circle{
	display: none;
}
#alertMsg .modal-dialog{
    width: 400px;
}
#alertMsg .modal-header .close{
  font-size: 32px;
  margin-top: -5px;
}
.ui-menu .ui-menu-item{
  padding: 2px 4px;
}
.charLimit{
  font-size: 12px;
  color: #97a2a8;
}
.navbar {
  padding: 0px;
  background: #0369dd;
  border: none;
  border-radius: 0;
  height: 65px;
  box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3);
}

.navbar-default .navbar-nav > li > a {
  color: #fff;
}

.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a:hover {
  color: #fff;
}
.navbar-btn {
  box-shadow: none;
  outline: none !important;
  border: none;
}
.navbar-btn .glyphicon-arrow-left {
  top: -1px;
  display: block;
}
.navbar-btn .glyphicon-menu-hamburger {
  display: none;
}

.navbar-btn.active .glyphicon-arrow-left {
  display: none;
}
.navbar-btn.active .glyphicon-menu-hamburger {
  display: block;
}

.nav-logo {
  margin-left: 30px;
  margin-top: -2px;
}
.navbar-notifation .fa-bell {
	font-size: 15px;
}
.navbar-notifation .badge {
	position: absolute;
    top: 11px;
    margin-left: -7px;
    font-weight: normal;
    color: #354463;
    padding: 3px 5px;
}
.line {
  width: 100%;
  height: 1px;
  border-bottom: 1px dashed #ddd;
  margin: 40px 0;
}

.navbar-right .rolocatorLink .glyphicon {
	padding: 0 5px;
}
/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */
#sidebar {
  width: 250px;
  position: fixed;
  top: 63px;
  left: 0;
  height: calc(100vh - 63px);
  z-index: 999;
  background: #fff;
  color: #999;
  transition: all 0.3s;
}

#sidebar.active {
  margin-left: -250px;
}

#sidebar .sidebar-header {
  padding: 20px;
  background: #1c54a2;
  color: #fff;
}

#sidebar ul.components {
  padding: 1px 0;
}

#sidebar ul p {
  /* color: #fff; */
  padding: 10px;
}

#sidebar ul li a {
  color: #6e7a93;
  padding: 10px 10px 10px 15px;
  font-size: 14px;
  display: block;
  border-left: 4px solid #fff;
}
#sidebar ul.collapse-submenu li a {
	padding: 10px 10px 10px 40px;

}
#sidebar ul li a:hover {
  color: #0369dd;
  border-left: 4px solid #0369dd;
  background: rgba(1, 105, 221, 0.2);
}

#sidebar ul li.active > a {
  color: #0369dd;
  border-left: 4px solid #0369dd;
  background: rgba(1, 105, 221, 0.2);
}
#sidebar ul .fa, 
#sidebar ul .far, 
#sidebar ul .fas,
#sidebar ul .glyphicon {
  padding-right: 8px;
  font-size: 14px;
  top: 2px;
}

a[data-toggle="collapse"] {
  position: relative;
}

.list-unstyled a[aria-expanded="false"]::before,
.list-unstyled a[aria-expanded="true"]::before {
  content: "\2b";
  display: block;
  position: absolute;
  right: 12px;
  top: 12px;
  font-family: "Glyphicons Halflings";
  font-size: 0.6em;
}
.list-unstyled a[aria-expanded="true"]::before {
  content: "\2212";
}

/* ul ul a {
  font-size: 0.9em !important;
  padding-left: 30px !important;
} */

.text-right{
  text-align: right;	
}
.va-top{
  vertical-align: top;	
}
/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */
#content {
  width: calc(100% - 250px);
  padding: 40px;
  min-height: 100vh;
  transition: all 0.3s;
  position: absolute;
  top: 60px;
  right: 0;
}
#content.active {
  width: 100%;
}
#content {
  padding: 0px 0px 20px 20px;
  min-height: 100vh;
  transition: all 0.3s;
}

#sidebarCollapse {
  width: 35px;
  height: 35px;
  background: #7bc1e8;
  color: #fff;
  border-radius: 50px;
}

#sidebarCollapse span {
  width: 80%;
  height: 2px;
  margin: 0 auto;
  display: block;
  background: #555;
  transition: all 0.8s cubic-bezier(0.81, -0.33, 0.345, 1.375);
  transition-delay: 0.2s;
}

#sidebarCollapse span:first-of-type {
  transform: rotate(45deg) translate(2px, 2px);
}
#sidebarCollapse span:nth-of-type(2) {
  opacity: 0;
}
#sidebarCollapse span:last-of-type {
  transform: rotate(-45deg) translate(1px, -1px);
}

#sidebarCollapse.active span {
  transform: none;
  opacity: 1;
  margin: 5px auto;
}
.form-group.required .control-label:after {
  content:"*";
  padding-left: 4px;
  color: red;
}

/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */
@media (max-width: 768px) {
  #sidebar {
    margin-left: -250px;
  }
  #sidebar.active {
    margin-left: 0;
  }
  #content {
    width: 100%;
  }
  #content.active {
    width: calc(100% - 250px);
  }
  #sidebarCollapse span {
    display: none;
  }
}

@media (min-width: 768px) {
  .navbar-nav > li > a {
    padding-top: 20px;
    padding-bottom: 15px;
  }
}

/* ---------------------------------------------------
    LOGIN
----------------------------------------------------- */

.login {
  /* background: linear-gradient(to bottom, #0099ff 0%, #fff 100%); */
  /* background: url(../../images/login-bg.jpg) center center no-repeat; */
  background-size: cover;
  height: 100vh;
  width: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
}
.account-login {
  width: 500px;
  box-shadow: 0 1px 11px rgba(0, 0, 0, 0.27);
  border-radius: 2px;
}
.account-login .form-control:focus {
  box-shadow: none;
}
.account-login p a {
  padding-left: 2px;
}
.account-login .login-logo {
  text-align: center;
  background: #fff;
  padding-top: 10px;
  height: 150px;
  width: 100%;
}
.login-form .form-group{
  display: flex;
}
.login-form .glyphicon{
  width: 35px;
  padding-top: 10px;
  font-size: 16px;
}
.login-form .login-password-wrapper{
	position:relative;
}
.login-form .login-password-wrapper .login-psw-eye{
	position:absolute;
	right:-16px;
	cursor:pointer;
}
.login-form input {
  width: 100%;
  position: relative;
  border-bottom: 1px solid #e0e0e0;
  padding: 0;
  border-top: 0px;
  border-left: 0px;
  border-right: 0px;
  box-shadow: none;
  border-radius: 0px;
  margin-bottom: 20px !important;   
}
.login-form {
  background: #fff;
  float: left;
  width: 100%;
  padding: 35px 55px 35px;
  border-radius: 5px;
}
.account-login button.btn {
  width: 100%;
  background: #009cff;
  font-size: 20px;
  padding: 11px;
  color: #fff;
  border: 0px;
  margin: 10px 0px 20px;
}
.account-login .btn:hover {
  color: #fff;
  opacity: 0.8;
}
.account-login p {
  float: left;
  width: 100%;
  text-align: center;
  font-size: 14px;
}
.account-login .remember {
  float: left;
  width: 100%;
  margin: 0 0 20px;
}
/* Customize the label (the container) */
.custom-checkbox {
  display: block;
  position: relative;
  padding-left: 27px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 13px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-weight: normal;
  padding-top: 2px;
  float: left;
}
/* Hide the browser's default checkbox */
.custom-checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
/* Create a custom checkbox */
.custom-checkbox .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: #bfbcbc;
}
/* On mouse-over, add a grey background color */
.custom-checkbox:hover input ~ .checkmark {
  background-color: #747474;
}
/* When the checkbox is checked, add a blue background */
.custom-checkbox input:checked ~ .checkmark {
  background-color: #2196f3;
}
/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
/* Show the checkmark when checked */
.custom-checkbox input:checked ~ .checkmark:after {
  display: block;
}
/* Style the checkmark/indicator */
.custom-checkbox .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);
}
@media (max-width: 767px) {
  .account-login {
    width: 90%;
  }
}

.viewlist-container .number-result{
	background-color: white;
    border: none;
}

iframe {
  display: block;
  border: none;
  height: 100vh ;
  width: 100%;
  margin-top: -100px;
}
.panel,
.panel-group .panel,
.btn-sm, .btn,
.form-control{
  border-radius: 4px;
}
.panel-primary>.panel-heading,
.panel-heading{
  border-radius: 0px;
  background-color: #0369dd;
  border-color: #0369dd;
}
.default-cur {cursor: default;}

#adminTab .tab-content {
  padding : 5px 0px;
  background-color: #fff;
}
#adminTab {
  background-color: #fff;
}
#adminTab .nav-pills > li > a {
  border-radius: 0;
}
.nav-bordred>li>a{
  border: 1px solid;
}
.back-link{
  width: 100%;
  text-align: right;
  padding : 20px;
}
.viewlist-search .back-link{
   padding : 0px;
}
.line-bottom{
/*   width: 100%;
  display: inline-block;
  border-bottom: 4px solid #e6e9f0;
  margin-bottom: 14px; */
}
/**
* Customer 360 profile tab
*/
.profile-details{
  /* background-color: #fff; */
/*   padding: 0 20px 0 0; */
}
.profile-details .form-control{
  cursor: default;
  box-shadow:none;

}
/* .profile-details .form-control:focus{
  border: none;
} */
.profile-details .form-group label{
  color: #354463;
  font-weight: 600;
}
.profile-subheading-second,
.profile-subheading{
 font-size: 18px;
 font-weight: 600;
 color: #354463;
 padding-bottom: 10px;
 margin: 0px 0 20px 0;
 border-bottom: 2px solid #cddae0;
}
.profile-subheading-second{
   padding: 20px 0px;
}

.subuser-tab .profile-details .form-control[readonly],
.profile-tab .profile-details .form-control[readonly],
.roprofile-tab .profile-details .form-control[readonly]
{
	width: 80%;	
	margin:10px 0px;
	background-color:#eff1f6;
}
.profile-details #petroCorpcardInfoTable .form-control[readonly] 
{
	width: 80%;	
	margin:0;
	background-color:#eff1f6;
}
.form-control[disabled], 
.form-control[readonly], 
fieldset[disabled] .form-control{
	color: black!important;
	background-color: #ffffff;
	border-radius: 4px;
	border-color: #97a2a8;
}
.form-control[readonly]{
	cursor: default;
}
.viewlist-container .content-empty {
  margin: 45px 0;
  font-weight: bold;
  font-size: 18px;
  text-align: center;
  padding-left: 30px;
  padding-right: 30px;
}
.viewlist-container .viewlist-header{
  padding: 20px 20px 10px 20px;
  background-color: #fff;
}
.head-title,
.viewlist-container .viewlist-header h1 {
  /* color: #000000; */
  color: #0369dd;
  font-weight: 600;
  font-size: 24px;
  margin: 0;
  display: inline-block;
}
.viewlist-container .viewlist-search{
   /*  background-color: #f4f4f4; */
   	background-color: #fff;
    padding: 20px;
 /*    box-shadow: 0 7px 20px 0 #eff1f6!important; */
}
.viewlist-container .viewlist-searchFilter{
	display: block;
	text-align: right;
    padding: 10px;
}
.viewlist-container .viewlist-searchFilter a{
	color: #0070e1;
	font-size: 18px;
}

/**
* Customer 360 profile tab BusinessInfo
*/
.profileBusinessInfo .checkbox-inline{
	font-weight: 500 !important;
}
.btn{
	font-family: 'Open Sans', sans-serif;
	text-transform: uppercase;
	font-size: 13px;
  	font-weight: bold;
	border-radius: 4px;
    padding: 8px 20px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.6px;
    cursor: pointer;
}
.btn.dropdown-toggle{
	padding: 6px 12px;
	text-transform: none;
} 
.btn-admin{
	background-color: #0369dd;
	
    color: #fff;
    /* border-radius: 4px;
    padding: 8px 20px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.6px;
    cursor: pointer; */
}
.btn-admin:focus, .btn-admin:hover,
.btn-admin.active.focus, .btn-admin.active:focus, 
.btnv.focus, .btn-admin:active.focus, 
.btn-admin:active:focus{
    color: #fff;
    outline: none;
}
.btn-admin-secondary{
	background-color: #fff;
    color: #0369dd;
    border: 1px solid #0369dd;
    /* border-radius: 4px;
    padding: 8px 20px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.6px;
    cursor: pointer; */
}
.btn-approve,
.btn-approve:hover{
	background-color:#ddfdf4 !important;
	color: #0ed39a;
}
.btn-reject,
.btn-reject:hover{
	background-color:#ffd8d8 !important;
	color: #e53737;
}
.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus{
	outline: none;
}
.btn-admin:hover {
	background-color: #0257a3;
    box-shadow: 0px 2px 4px -1px rgb(0 0 0 / 20%), 0px 4px 5px 0px rgb(0 0 0 / 14%), 0px 1px 10px 0px rgb(0 0 0 / 12%);
}
.btn-admin-secondary:hover {
	color: #0369dd;
    border: 1px solid #0369dd;
    background-color: rgba(3, 105, 221, 0.04);
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}
.btn-admin:disabled{
	background-color: #eff1f6;
	color: #afb8bc;
	cursor: default;
	border: 1px solid #afb8bc;
}
.btn-admin:disabled:hover{
	 box-shadow:none;
}
.bootstrap-select .dropdown-toggle:focus, 
.bootstrap-select>select.mobile-device:focus+.dropdown-toggle{
	outline: none !important;	
}
.bootstrap-select .btn-default{
	color: #555 !important;
	font-weight: 400;
}
.bootstrap-select.show-tick .dropdown-menu .selected span.check-mark{
	color: #0369dd;
}

/**

This will be common

***/
.upload-btn-wrapper {
  	position: relative;
  	overflow: hidden;
  	display: inline-block;
}
.upload-btn-wrapper .btn {
  	background-color: #0369dd;
  	color: #fff !important;
  	border-radius: 4px;
  	padding: 8px 20px;
  	font-size: 14px;
  	font-weight: 600;
  	letter-spacing: 0.6px;
}
.upload-btn-wrapper input[type=file] {
  font-size: 100px;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
.upload-btn-wrapper .error{
	display: block;
}
.upload-btn-wrapper-text{
	background-color: #f6f8fb;
	margin-top: 10px;
}
.upload-btn-wrapper-text h4{
    display: inline-block;
    font-size: 16px;
    padding-left: 5px;
}
.upload-btn-wrapper-text .glyphicon {
	color: #eb4551;
}
.upload-btn-wrapper-text .glyphicon-trash {
	padding: 10px;	
}




/**
* Card tab
*/
.nav-card.nav-pills > li > a {
  border-radius: 0;
}
.nav-bordred>li>a{
  border: 1px solid;
}
.nav-card{
  display: flex;
  margin: 0;
  padding: 0;
  margin-left: 2px;
}
.nav-card>li{
  flex-grow: 1;
  flex-basis: 0;
  list-style-type: none; 
  margin: 1px;
}
.nav-card>li>a,
.nav-card>li>a:hover{
   background-color: #dff0fd;
   display: block;
   width: 100%;
  /*  cursor: default; */
   color: #101010;
   text-align: center;
   padding: 10px 5px;
   text-decoration: none;
   border-right: 1px solid #ececec;
   margin-right: 1px;
}
.nav-card>li.active>a, .nav-card>li.active>a:focus, .nav-card>li.active>a:hover{
  background-color: #0369dd;
  color: #fff;
}
.nav-card .badge{
  min-width: 35px;
  border-radius: 6px;
  margin-left: 5px;
  color: #fff;
}
.nav-card >.active>a>.badge {
  color: #fff;
}
.cardUnassigned, .cardblue,
.nav-card .badge.blue{
  background-color: #007bff !important;
}
 .carddarkBlue
 {
  background-color: #501ec8 !important;
}
.cardActive, .cardgreen,
.nav-card .badge.green{
  background-color: #28a745 !important;
}
.cardBlocked, .cardred,
.nav-card .badge.red{
  background-color: #dc3545 !important;
}
.cardHotlisted,.cardyellow,
.nav-card .badge.yellow{
  background-color: #ffc107 !important;
}
.nav-card .badge.cyan{
  background-color: #17a2b8 !important;
}
.cardInactive,
.nav-card .badge.grey{
  background-color: #6c757d !important;
}
.cardTerminated,
.nav-card .badge.pink{
  background-color: #FF1493 !important;
}
.circle-sm{
  height: 10px;
  width: 10px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
}
.hiddenRow {
 	border: none !important;
    font-size: 13px;
    padding: 10px;
    display: none;
}
td.more-info::before{
	content:"\e250";
    display: block;
    position: absolute;
    right: 20px;
    padding-top: 0px;
    font-family: "Glyphicons Halflings";
    font-size: 1em;
    cursor: pointer;
    transition: all 0.5s ease;
}
tr.shown td.more-info::before{
	 transform: rotate(90deg);
}
.hiddenRow .moreDetails{
  display: flex;
  flex-wrap: wrap;
  /* justify-content: space-between; */
  padding: 0px;
}
.hiddenRow .moreDetails .info{
  display: flex;
  flex-direction: column;
  width: 24%;
  padding: 10px 0;
}
.hiddenRow.petroCorpCard .moreDetails .info
{
	width: 100%;
}
.hiddenRow .creMoreDetails .info{
  width: 20%;
}
.hiddenRow .w-20 .info{
  width: 20%;
}
.hiddenRow .moreDetails .info label{
  font-weight: 700;
}
#dealerCreditPouchTable .hiddenRow .moreDetails .info{
  width: 20%;
}
.flexEq .hiddenRow .moreDetails .info{
   flex: 1;
}
#dealerCreditPouchTable .hiddenRow .moreDetails .info .addressText{
  width: 150px;
  word-break: break-word;
}
.downmenu{
  cursor: pointer;
}
.card-table{
  margin-top: 20px;
}
.card-table th{
  background: #ececec;
}
tr.dropdownRow td:last-child{
  display: flex;
  justify-content: space-between;
}
.downmenu[aria-expanded="true"]::before,
.downmenu[aria-expanded="false"]::before {
  content:"\e114";
  right: 0px;
  font-family: "Glyphicons Halflings";
  font-size: 1em;
}
.downmenu[aria-expanded="true"]::before {
  content:"\e113";
}
.card-number-highlight{
  color: #0369dd;
  font-weight: bold;
}
.dot{
  height: 12px;
  width: 12px;
  padding-right: 4px;
  background-color: #28a745;
  border-radius: 50%;
  display: inline-block;
}
.green-text{
  color: #28a745 !important;
}
.info-text{
   font-size: 14px;
   color: #354463;
   margin: 10px 0;
   font-weight: 500;
}
/**
* Card information tab
*/
/* .customer-pagination{
  text-align: right;
}
 */
 
.card-tab .nav-stacked>li{
  float: left;
  margin-top: 0px;
}
.card-tab .profile-details .form-control[readonly]{
  width: 60%;
}
.card-tab .col-xs-6{
 	padding-left: 0px;
}
.card-tab .cardDetails,
.card-tab .cardSummary{
 	padding-top: 20px;
}
/**
* Sub Menu
*/
ul.submenu {
  list-style-type: none;
  margin: 0 0 15px 0;
  padding: 0;
  overflow: hidden;
  background-color: #ffffff;
  width: 100%;
}

ul.submenu > li {
  float: left;
  border-right: 1px solid #d1d1d1;
  background-color: #dff0fd;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px
}

ul.submenu > li.active {
  background-color: #0369dd;
  color: #fff;
  font-weight: bold;
}

ul.submenu > li.active a {
  color: #fff;
}

ul.submenu > li a {
  display: block;
  color:#101010;
  text-align: center;
  padding: 10px 20px;
  text-decoration: none;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}

ul.submenu > li a:hover {
  background-color: #0369dd;
  color: #fff;
}


ul.submenu.bn {
	border-radius: 5px;
}
ul.submenu.bn > li{
	border-radius: 5px;
	margin-right: 20px;	
	text-transform: uppercase;
}
ul.submenu.bn > li a:hover {
	border-radius: 5px;
}

.company-title{
  font-size: 20px;
  color: #000000;
  margin-top: 5px;
}
.submenu-container{
  background-color: #ffffff;
  padding: 20px;
  /* padding:2%; */
}
.submenu-container .nav-pills>li.active>a,
.submenu-container .nav-pills>li.active>a:hover{
	color: #0369dd;
  background-color: #fff;
  border-color: #0369dd;
  font-weight:bold;
}
.submenu-container .sub-pills{
	margin-bottom:10px;
}
.submenu-container .sub-pills>li{
	border:1px solid #0369dd;
	margin-left:0px !important;
	color: #0369dd;
}
.submenu-container .sub-pills>li.active>a,
.submenu-container .sub-pills>li.active>a:hover{
	color: #fff;
  background-color: #0369dd;
  border-color: #0369dd;
  font-weight:bold;
  border-radius:0px;
}
.submenu-container .nav-bordred>li>a{
  color: #354463;
  margin: 9px 5px 9px 0px;
  background-color: #ffffff;
	border: 1px solid #d2d2d2;
	border-radius: 4px;
  box-shadow: 0 2px 15px 0 #e5e8ef;
}
.submenu-container .nav-bordred>li:first-child>a{
	margin-top: 0px;
}
.roprofile-tab .row,
.card-tab .row,
.subuser-tab .row,
.profile-tab .row{
  	margin: 0px;
}
.subuser-tab .col-sm-3,
.profile-tab .col-sm-3,
.roprofile-tab .col-sm-3{
	padding-left: 0px;	
}
.subuser-tab .tab-content,
.profile-tab .tab-content,
.roprofile-tab .tab-content{
	min-height: calc(100vh - 265px);
}
.service-link{
	padding: 10px 20px;
	color: #046add;
	text-decoration: underline;
}
.btn-back,
.btn-back:hover{
	color: #fff;
    background-color: #555555;
    border-color: #555555;
    border-radius: 4px;
}

/**
* Wallet Tab
*/
.wallet-section{
  margin: 20px;
}
.wallet-box{
  display: flex;
  /* justify-content: space-between; */
  margin: 0 20px;
}
.box-title{
  display: block;
  color: #101010;
  font-size: 16px;
  font-weight: 600;
  padding-bottom: 5px;
}
.box-info{
  display: inline-block;
  color: #101010;
  width: 25%;
  /* text-align: center; */
  background: #fff;
  padding: 16px 5px 10px 16px;
  margin-right: 20px;
  font-size: 16px;
  font-weight: 600;
  
  min-height: 81px;
  border-radius: 3px;
  box-shadow: rgb(0 0 0 / 5%) 0px 6px 24px 0px, rgb(0 0 0 / 8%) 0px 0px 0px 1px;
}
.box-info .box-text {
    display: inline-block;
    color: #101010;
    font-size: 20px;
    font-weight: 600;
    padding-left: 10px;
}
.box-info .box-info-small {
    font-size: 14px;
    font-weight: 500;
    color: #354463;
}
.box-info img{
	display: inline-block;
    width: 42px;
    vertical-align: top;
}
.box-info-small{
  font-size: 12px;
  font-weight: 500;
}
.wallet-head{
  background-color: #c9c9c9;
  display: flex;
  justify-content: space-between;
  padding: 10px 20px;
  color: #101010;
  font-size: 16px;
  font-weight: 600;
}
.wallet-head a{
	color: #046add;
    text-decoration: underline;
    font-size: 13px;
    font-weight: 500;
}
.wallet-fields label{
    color: #101010;
    font-size: 12px;
}
.wallet-fields .form-control{
    min-width: 275px;
}
.wallet-fields{
    display: inline-block;
   /*  padding: 20px 0 20px 20px; */
}
.wallet-fields .wallet-box{
	margin: 20px 0;
}
.wallet-fields .box-info{
	width: auto;
	padding: 20px;
}

.wallet-fields .form-group{
    display: inline-block;
    padding-right: 50px;
}

/**
* forgot password
*/
.password-wrapper{
	background-color: #eff1f6;
	margin-top: 65px;
	min-height: calc(100vh - 65px);
	justify-content: center;
    align-items: center;
    display: flex;
}
.password-container{
	padding: 10px 30px;
	background-color: #fff;
	margin-top: 30px;
	min-width: 576px;
	min-height: 570px;
	border-radius: 6px;
	text-align: center;
	/* font-size: 0.875rem; */
    font-family: "Open Sans",Raleway;
    font-weight: 400;
    line-height: 1.5;
    color: #354463;
}
.password-container .password-head  h1{
	font-size: 22px;
	padding-top: 5px;
    padding-right: 35px;
    font-weight: 600;
    color: #0257a3;	
} 
.password-container .password-logo{
	height: 220px;
	padding: 45px;
}
.password-container .password-head img{
	width: 35px;
}
.password-container .form-group label{
	display: block;
}
.password-container p{
	color: #354463;	
}
.password-container .receive-text,.password-container .otpTimer {
 	justify-content: center;
    display: flex;	
    padding: 10px;
    font-size: 12px;    
}
.password-container a{
    color: #0257a3;
    font-weight: 600;
    float: left;	
}
.password-container .btn{
	height: 50px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.6px;
    width: 100%;
    margin-top: 30px;
    border-radius: 4px;
    color: #fff;
    background-color: #0369dd;
}
.password-container .pass-input{
    width: 100%;
    height: 40px;    
}  
.password-container .login-text{
	display: flex;
    justify-content: center;
}
.password-container .login-text a{
	display: flex;
    justify-content: center;
    font-size: 20px;
    padding: 20px;
    border-radius: 4px;
    color: #fff;
    background-color: #0369dd;
}

/**
* Data Table style
*/
.dataTables_wrapper .dataTables_paginate .paginate_button:active,
.dataTables_wrapper .dataTables_paginate .paginate_button,
.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.current, 
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
    border-radius: 50%;
}
/**
* Table
*/

.tableAdmin th{
	background-color: #eff3fa;
	vertical-align: middle !important;
	font-size: 13px;
}
.tableAdmin td{
	color: #354463;
	padding: 13px 10px !important;
	border-top: 5px solid #fff !important;
	font-size: 13px;
}
.tableAdmin tbody tr{
	border-radius: 3px;
 	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
.tableAdmin thead th, .tableAdmin thead td{
    padding: 13px 10px  !important;
    border-bottom: 6px solid #eff3fa  !important;
}
.tableAdmin{
	/* table-layout: fixed; */
	border-bottom: none !important;
	border-spacing: 0 0.3em !important;
}
.dataTables_filter{
	display: none !important;
}
.paging_simple_numbers{
	margin-top: 10px;
    padding: 10px !important;
    /* border: 1px solid #CACAE0; */
    /* width: 100%; */
    border-radius: 4px;
    background-color: #fff;
}
table.dataTable thead th {
    position: relative;
    background-image: none !important;
}
 
table.dataTable thead th.sorting:after,
table.dataTable thead th.sorting_asc:after,
table.dataTable thead th.sorting_desc:after {
    position: absolute;
    top: 12px;
    right: 8px;
    display: block;
    font-family: "Font Awesome 5 Free";
}
table.dataTable thead th.sorting:after {
    content: "\f0dc";
    color: #666667;
    font-size: 1.2em;
    padding-top: 0.5em;
}
table.dataTable thead th.sorting_asc:after {
    content:"\f0de";
}
table.dataTable thead th.sorting_desc:after {
   content:"\f0dd";
}
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc{
	background-image: none !important;
}
table.dataTable thead th.sorting:after, table.dataTable thead th.sorting_asc:after, table.dataTable thead th.sorting_desc:after {
  position: inherit;
  display: inline;
}
table.dataTable thead th.sorting:after, table.dataTable thead th.sorting_asc:after, table.dataTable thead th.sorting_desc:after {
  right: -.5em;
}
table.table thead th.sorting:after, table.table thead th.sorting_asc:after, table.table thead th.sorting_desc:after {
  top: 0px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, 
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button:hover{
	background: #0369dd;
	background-color: #0369dd;
	border-color: #0369dd;
	color: #fff !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.previous,
.dataTables_wrapper .dataTables_paginate .paginate_button.next,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.next:hover{
	color: #0369dd !important;
	background: none;
	border:none;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled, 
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, 
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active{
	color: #ccc !important;
}
 
/**  Show more update */
table.dataTable tbody td.no-padding {
    padding: 0 !important;
}
table.dataTable thead th.no-sort:after{
    content: '';
}

/**
* retail Outlet
*/
.welcome-div{
	padding-top: 30px;
	display:block;
	text-align: center;	
}

.rotypelist{
	margin: 10px 0;
}
.rotypelist label,
.rotypeamenties label{
	color: #101010;
    font-weight: 600;
    display: block;
}
.rotypeamenties img{
	width: 34px;	
}
.rotypelist .list-name{
	font-weight: 500;
	padding-left: 0px;
	padding-right: 30px;
}
.rotypeamenties{
	margin: 15px 0;
}
.rotypeamenties .col-xs-3{
	padding: 5px 0;
}
.rotypeamenties .glyphicon {
	background-color: #cecece;
    padding: 10px;
    border-radius: 50%;
    margin-right: 10px;
}
/**
* Customer 360 search
*/
#searchTableError,
#customerSearchTable,
#retailOutletSearchTableError,
#customerSearchTableError{
	display: none;
}

/**
* retail Outlet AutoComplete
*/
.ui-autocomplete {
  max-height: 100px;
  overflow-y: auto;
  overflow-x: hidden;
}
/* IE 6 doesn't support max-height
 * we use height instead, but this forces the menu to always be this tall
 */
* html .ui-autocomplete {
  height: 100px;
}

.creonboardlink{
	float: right;
    margin-right: 15px;	
}
.modalBody{
	display: none;	
}
.adminModal .modal-title{
	color: #0257a3;
    font-weight: 600;
}
.adminModal .modal-header .close {
	margin-top: -6px;
}
.adminModal .modal-header {
	border-bottom: none;
	padding: 25px;
}
.adminModal .modal-body{
	padding: 0 25px 25px 25px;
}
.adminModal .modal-footer {
	border-top: none;
}
.adminModal .modal-dialog {
    width: 700px;
    margin: 80px auto;
}
.adminModal.modal-lgm .modal-dialog {
	width: 800px !important;
}
.adminModal .close{
	font-size: 36px;
    font-weight: 500;
}
.adminModal p{
	color:#354463;
  font-size: 14px;
  font-weight: 500;
}
.adminModal.center .modal-header,
.adminModal.center .modal-body,
.adminModal.center .modal-footer{
    text-align: center;
    padding: 20px;
}
.confirmDialog .modal-dialog{
    width: 500px;
    margin: 80px auto;
}
.hideSecondBtn .modal-footer .btn-admin-secondary{
    display: none;
}
.confirmDialog .modal-footer{
    padding: 20px;
}
.confirmDialog .modal-body{
    padding: 0px 20px;
}
.confirmDialog.center .modal-header,
.confirmDialog.center .modal-body,
.confirmDialog.center .modal-footer{
    text-align: center;
    padding: 20px;
}

.adminModal.noFooter .modal-footer,
.confirmDialog.noFooter .modal-footer{
	display: none;
}

/**
* CRE Registration
*/

.cre-container .req-text {
	text-align: right;
	font-size: 12px;
}
.cre-container .req-text .red{
	color: red;
}
.cre-container .form-head{
    border-bottom: 1px solid #cccccc;
    padding: 10px 0;
    margin-bottom: 20px;
    font-size: 16px;
    font-weight: 700;
}
.cre-container .copy-address{
	margin-bottom: 15px;
}
.cre-container .plain-list{
	padding-left: 14px;
    font-size: 12px;
    margin: 10px 0;
}
.cre-container .file-list{
	padding: 0px;
	list-style-type: none; 
}
/**
* CRE Registration Assign Custome
*/
.assignCreCustomerTop{
	padding-bottom: 10px;
}
.assignCreCustomerTop p{
	color: #333;
    float: right;
    padding-top: 5px;
    font-size: 14px;
}
/**
* Error Class
*/
label.error{
	color: red;
	padding: 2px 0px;
    font-size: 12px;
    margin-bottom: 0;
}
/**
* Error Class
*/
.form-head{
    border-bottom: 1px solid #cccccc;
    padding: 10px 0;
    margin-bottom: 20px;
    font-size: 16px;
    font-weight: 700;
    color: #0369dd;
}
/**
* Dealer Credit Pouch Management
*/
.credit-box {
	 display: flex;
	 justify-content: space-between;
}
.credit-box .box-container{
	height: 81px;
  	border-radius: 3px;
  	box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;  
	display: inline-block;
	/* width: 32%; */
	flex-grow: 1;
	margin: 5px;
    max-width: 400px;
    background: #fff;
    padding: 16px 5px 16px 16px;
   	margin-bottom: 20px;

}
.credit-box .box-container:first-child {
	margin-left: 0px;
}
.credit-box .box-container:last-child {
	margin-right: 0px;
}
.credit-box img{
	display: inline-block;
	width: 42px;
	vertical-align: top;
}
.credit-box .box-text{
	display: inline-block;
	color: #101010;
	font-size: 20px;
    font-weight: 600;
    padding-left: 16px;
}
.credit-box .box-info-small{
	font-size: 14px;
    font-weight: 500;
    color: #354463;	
}
#dealerCreditPouchStatus{
	margin-bottom: 10px;
}

.active-circle,
.dective-circle {
  height: 10px;
  width: 10px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
}
.active-circle{
	background-color: #55ca70;
}
.dective-circle {
	background-color: #8f8f9f;
}

/**
* No pending Enrollment
*/
.pendingEnrolment{
  display: block;
  text-align: center;
  margin: 40px 0;
}
.pendingEnrolment img{
  height: 220px;
  padding: 45px;
}
.pendingEnrolment p{
  color: #354463;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  padding-bottom: 15px;
}


/**
* forgot password
*/
.card-wrapper{
	background-color: #eff1f6;
	min-height: calc(100% - 80px);
	justify-content: center;
  align-items: center;
  display: flex;
}
.card-container{
	padding: 20px;
	background-color: #fff;
	margin-top: 10px;
	min-width: 576px;
  max-width: 576px;
	min-height: 570px;
	border-radius: 6px;
	text-align: center;
	/* font-size: 0.875rem; */
  font-family: "Open Sans",Raleway;
  font-weight: 400;
  line-height: 1.5;
  color: #354463;
}
.card-container .card-head  h1{
	font-size: 22px;
	margin-top: 5px;
  padding-right: 35px;
  font-weight: 600;
  color: #0257a3;	
} 
.card-container .card-logo{
	height: 220px;
	padding: 45px;
}
.card-container .card-head img{
	width: 32px;
  margin-top: -4px;
}
.card-container .card-head .back{
  float: left;
}
.card-container .form-group label{
	display: block;
}
.card-container .receive-text{
 	justify-content: center;
  display: flex;	
  padding: 10px;
  font-size: 12px;    
}
.card-container a{
  color: #0257a3;
  font-weight: 600;
}
.card-container .btn{
	height: 50px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.6px;
  width: 100%;
  margin-top: 30px;
  border-radius: 4px;
  /* color: #fff;
  background-color: #0369dd; */
}
.card-container .pass-input{
    width: 100%;
    height: 40px;    
}  
.card-container .login-text{
	  display: flex;
    justify-content: center;
}
.card-container .login-text a{
	  display: flex;
    justify-content: center;
    font-size: 20px;
    padding: 20px;
    border-radius: 4px;
    color: #fff;
    background-color: #0369dd;
}
.card-container .signup-text{
  padding-top: 1rem !important;
  font-size: 12px;
  color: #354463;
}
.card-container .signup-text a{
  font-weight: 700;
}
.login-container .form-group label{
  font-size: 14px;
  font-weight: 600;
  text-align: left;
  color: #354463;
}
.signup-container .checkbox label{
  text-align: left;
  color: #97a2a8;
  margin-right: 3px;
  font-size: 13px;
  font-weight: 400;
}
.signup-container .whatsapp-input,
.signup-container .whatsapp-group{
  display: none;
}
.signup-container .whatsapp-text{
  text-align: left;
}
.signup-container .whatsapp-text .glyphicon{
  font-size: 16px;
  padding-right: 10px;
}
/**
*  Business Type
*/
.businesstype-container .businesstype-text{
  font-size: 14px;
  text-align: center;
  color: #354463;
  padding-top: 50px;
}
.businesstype-container .selectType{
  display: flex;
  padding-top: 90px;
  padding-bottom: 20px;
}
.businesstype-container .selectText{
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  color: #0466bf;
  padding-top: 20px;
}
.businesstype-container .imgCircle{
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background-color: #e9f9fe;
  margin: 0 auto;
}
.businesstype-container .imgCircle img{
  padding-top: 20px;
}
.businesstype-container .selectTypeBox{
  width: 33%;
  border-radius: 4px;
  padding: 20px 0 30px 0;
}
.businesstype-container .selectTypeBox.active{
  background-color: #daf5fd;
}
.businesstype-container .selectTypeBox.active .imgCircle{
  background-color: #fff;
}
/**
*  Update Approval Status
*/
.updateApprovalContainer  h4.cb{
	margin-bottom:15px;
}
.updateApprovalContainer .appDetails .table{
    background-color: #eff3fa;
}
.updateApprovalContainer .appDetails .table .glyphicon{
	padding: 14px;
    font-size: 18px;
	color: #0369dd;
}
.updateApprovalContainer .nobor td{
	border: none;
}
.updateApprovalContainer tbody tr td{
  width: 30%;
  padding: 20px;
}
.updateApprovalContainer tbody tr td:first-child {
  width: 10%;
  text-align: center;
}
.updateApprovalContainer tbody tr:first-child td{    
	border-top: none;
}
/* .updateApprovalContainer tbody tr:last-child td{    
	padding: 0px 20px 20px 20px;
} */
.updateApprovalContainer .circle{
	height: 50px;
    width: 50px;
    background: #dff0fd;
    border-radius: 50%;
    display: block;
    text-align: center;
    margin: 0 auto;
}
.updateApprovalContainer .card{
	padding: 10px;
	border-radius: 4px;
	background-color: #eff3fa;
	margin-bottom: 10px;
}
.updateApprovalContainer .card .fa-file{
	color: #dc3545;
}
.updateApprovalContainer .card .fa,
.updateApprovalContainer .card .glyphicon{
	font-size: 28px;
    padding: 5px;
}
.updateApprovalContainer .card .glyphicon-download-alt{
	font-size: 16px;
    padding: 10px 0;
}
.updateApprovalContainer .aprovalBox{
	box-shadow: 0 2px 10px 0 #eff1f6;
    padding: 20px 10px;
    margin: 0;
    margin-bottom: 20px;
    height: 80px;	
}
.updateApprovalContainer .aprovalBox .head{
	display: inline-block;
	padding-right: 20px;
    font-size: 16px;
    font-weight: 600;
    padding-top: 5px;
}
.updateApprovalContainer .rejecText{
	display:inline-block;
	border-left: 1px solid;
    padding-left: 20px;
    cursor: pointer;
}
.updateApprovalContainer .rejecTextWrap{
	padding: 20px 20px 20px 0;
	margin-top: 5px;
	border-radius: 4px;
	background-color: #eff3fa;
	min-width: 430px;
	line-height: 1.8em;
	position: absolute;
	z-index: 1;
	display: none;
}
.updateApprovalContainer .rejecText:hover + .rejecTextWrap {
  	display: block;
}

.rejectKYCReset,
.approveKYCReset,
.approveKYCSelect,
.rejectFuelReset,
.approveFuelReset,
.approveFuelSelect{
	display: none;
}
.rejectKYCReset.active,
.approveKYCReset.active,
.approveKYCSelect.active,
.rejectFuelReset.active,
.approveFuelReset.active,
.approveFuelSelect.active{
	display: block;
}

.deliverymodal .modal-header{
	text-align: center;
	padding-bottom: 5px;
}
.deliverymodal p.sub{
	text-align: center;
}

.deliverymodal .timeline {
    width:100%;
	margin: 30px 0px;
}
.deliverymodal .content {
    width:33%;
    text-align:center;
    float:left;
}
.deliverymodal .glyphicon {
    display: inline-block;
    color: #0257a3;
	font-size: 20px;
    padding-bottom: 10px;
}
.deliverymodal .circle-content p {
    font-size:16px;
    color:#666;
}

.submenu-container .profile-details-gridSection{
	padding:0px !important;
}



/* retailEnrollmentStatus.jsp */
.contentWrapLine {
    display: flex;
    justify-content: space-between;
    position: relative;
}
.popupLine:not(:last-of-type)::after {
  	content: "";
    background-color: #0257a3;
    height: 2px;
    width: 199px;
    position: absolute;
    top: 14%;
    margin-top: -1px;
}

.popupLine:nth-child(1)::after {
	left: 116px;
}
.popupLine:nth-child(2)::after {
	right: 116px;
}
.cardDeliveryStatuPopupMargin{
	margin-left:30px;
}
.overFlowXHidden{
	overflow-x:hidden;
}

a.FontAwesomeLeftArrow::before{
   font-family: "Font Awesome 5 Free";
   content: "\f060";
   padding-right: 15px;
   color:#6e7a93;
   font-weight:900;
   font-size: 18px;
}
a.FontAwesomeLeftArrow:hover::before{
   color: #0369dd;
}
.dealerCreditManagement{
   margin:0!important;
}
.updatelink{
  padding: 8px 17px!important;
  font-size: 12px!important;
}
a.paymentPendingModalPointer{
	cursor: pointer;
}
.cursorPointer{
	cursor: pointer;
}
.tableTextCenter{
   line-height: 4.428571;
   margin-left: 30px;
}
.more-info.creMoreInfo{
	padding: 0px!important;
    line-height: 3;
}
.FSODetailsUserInfoFooter{
	border-top:none;
}
.FSODetailsUserInfoSubmenu{
	margin:0px!important;
}
.alert-dismissible{
	background-color: #eff3fa;
	border-color: #eff3fa;
	color: #354463;
}
.alert-dismissible.error-div{
	color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}
.textAlign{
	text-align:center;
}
.tooltipCss{
	float:right;
	margin-top: 3px;
}
/**
 * Approval Common Page Update Approval Status
 */
.approvalStatusPage  h4.cb{
	margin-bottom:15px;
}
.approvalStatusPage .appDetails .table{
    background-color: #eff3fa;
}
.approvalStatusPage .appDetails .table .glyphicon{
	padding: 14px;
    font-size: 18px;
	color: #0369dd;
}
.approvalStatusPage .nobor td{
	border: none;
}
.approvalStatusPage tbody tr td{
  width: 30%;
  padding: 20px;
}
.approvalStatusPage tbody tr td:first-child {
  width: 10%;
  text-align: center;
}
.approvalStatusPage tbody tr:first-child td{    
	border-top: none;
}
.approvalStatusPage .circle{
	height: 50px;
    width: 50px;
    background: #dff0fd;
    border-radius: 50%;
    display: block;
    text-align: center;
    margin: 0 auto;
}
.approvalStatusPage .card .fa-file{
	color: #dc3545;
}
.approvalStatusPage .card{
	padding: 10px;
	border-radius: 4px;
	background-color: #eff3fa;
	margin-bottom: 10px;
}
.approvalStatusPage .card .fa,
.approvalStatusPage .card .glyphicon{
	font-size: 28px;
    padding: 5px;
}
.approvalStatusPage .card .glyphicon-download-alt{
	font-size: 16px;
    padding: 10px;	
}
.approvalStatusPage .aprovalBox{
	box-shadow: 0 2px 10px 0 #eff1f6;
    padding: 20px 10px;
    margin: 0;
    margin-bottom: 20px;
    height: 80px;	
}
.approvalStatusPage .aprovalBox .head{
	display: inline-block;
	padding-right: 20px;
    font-size: 16px;
    font-weight: 600;
    padding-top: 5px;
}
.approvalStatusPage .rejecText{
	display:inline-block;
	border-left: 1px solid;
    padding-left: 20px;
    cursor: pointer;
}
.approvalStatusPage .rejecTextWrap{
	padding: 20px 20px 20px 0;
	margin-top: 5px;
	border-radius: 4px;
	background-color: #eff3fa;
	min-width: 430px;
	line-height: 1.8em;
	position: absolute;
	z-index: 1;
	display: none;
}
.approvalStatusPage .rejecText:hover + .rejecTextWrap {
  	display: block;
}
.customer360Container .widthCustomer360 td:nth-child(2) {
	width:16%;	
	word-break: break-word;	
}
.customer360Container .widthCustomer360 td:nth-child(4) {
	width:10%;
}
.customer360Container .widthCustomer360 td:nth-child(7) {
	width:22%;	
}
.fleetEnrollmentContainer .widthEnrollmentStatus td:nth-child(5) {
	width:16%;
	word-break: break-word;	
}
.dealerCreditContainer .hiddenRow .moreDetails .info{
  display: flex;
  flex-direction: column;
  width: 83%!important; 
  padding: 10px 0;
}
.subdetails{
	width:100%;
}
.dealerCreditContainer .checklist input[type=checkbox] {
    width: 18px;
    height: 20px;
    vertical-align: -webkit-baseline-middle;
    margin-bottom: 15px;
    margin-right: 8px;
}
.dealerCreditContainer .checkbox-inline span {
    font-size: 12px;
    font-weight: normal;
    padding: 0px 8px;
    line-height: 2;
}
.dealerCreditContainer .limittypeText .form-control {
    width: 120px!important;
}
.dealerCreditContainer .hiddenRow .moreDetails .label {
    font-weight: 100!important;
}
.dealerCreditContainer .infodailylimit{
	width:33%;
}
.btn-admin.fsoConsolidatePerformance{
	background-color: #dce4f7;
	color:#000;
}
.roTidModal{
	margin-top: -41px;
    margin-bottom: 30px;
}
.creReasonForRejection{
	margin-top: -24px;
    margin-bottom: 40px;
}
select[multiple]{
	height: 34px;
}
#SoTransactionSearchForm .form-group
{
	position:relative;
}
#SoTransactionSearchForm .form-group .datepicker-calender
{
	position:absolute;
	right: 6px;
  top: 32px;
  cursor:pointer;
}
.cardpopup-details{
   text-align: center;
}
.moreDetails.partneroutlet .partneroutletinfo .info.cardStatus{
	 width: 500px!important;
}
.moreDetails.partneroutlet .partneroutletinfo .info.cardSalesTransaction{
	min-width: 294px;
}
.btn.dropdown-toggle.disabled.btn-default{
 color:#000!important;
 opacity: 1;
 }
 .customer360tagfile::-webkit-input-placeholder {
  color: #000;
}
.adminFrontend{
	padding: 15px 10px 10px 45px;
    display: block;
    color:#000;
}
.adminTableFontawesome{
	margin-left: 28%
}
.liDisabled{
	background-color: #E6E6E6;
	color: #bfbec4!important;
}
.liDisabled:hover
{   text-decoration: none!important;
	background-color: #E6E6E6!important;
	color: #bfbec4!important;
}
#getStatusPan{
    background-color: #0369dd;
    color: #fff;
}
#getStatusPan:disabled {
     background-color: #eff1f6;
     color: #afb8bc;
     cursor: default;
     border: 1px solid #afb8bc;
 }
.d-flex{
  display: flex;
}
.justify-content-end{
  justify-content: end;
}
.align-center{
  align-items: center;
}
.mb-5 {
  margin-bottom: 5px;
}
.font-weight-bold{
  font-weight: 600;
}


.password-container .alert-danger, .account-login .alert-danger {
    background: #ffd1d1;
    color: #e21e1e;
    font-weight: 500;
    display: flex;
    flex-direction: row;
    align-items: center;
    text-align: left;
}
.password-container .alert-danger  img,.account-login .alert-danger img {
    padding-right: 10px;
    display: inline-block;
}
#panError {
    display:none;
    color:#f00;
    font-size:11px;
    font-weight:600;
   }
#pan{
    text-transform:uppercase;
}

#kycApproval .modal-dialog {
    width:600px
}
#kycApproval .kycAproval {
    display:flex;
    padding-left:20px;
}
#kycApproval .kycAproval span{
    display: inline-block;
    padding: 0 10px 0 18px;
}
#kycApproval .modal-header{
    padding-bottom:0;
    }
#kycApproval .modal-title {
   padding: 20px 0 0 20px;
    text-align:left;
    }
#kycApproval .modal-body {
    text-align: left;
}
#kycApproval  .modal-footer  {
    text-align:right;
 }
 .dflex .rejecText + .rejecTextWrap{
     margin-top: 26px;
     padding: 10px 0 0;
 }
.bootstrap-select .dropdown-menu{
    z-index: 9999;
}