#vsloader{
	width:100%;
	height:100%;
	position:fixed;
	z-index:9999;
	background:url("../images/loading.gif") no-repeat center center rgba(0,0,0,0.25)
}
.mr-5{
	margin-right: 5px;
}
.hr-line {
  float: left;
  width: 100%;
  border-top: 1px solid #eee;
  margin-bottom: 15px;
}
.hr-line-double {
  border-top:2px solid #c5c5c5;
}
.flash-message .alert{ margin-bottom:15px;}
.navbar-default.navbar-static-top .navbar-nav>li>a{
	padding: 14px 10px;
}
.notifyRed {
	text-align: center;
	margin: 10px 0px;
	color: red;
}
.minheight200{min-height: 200px;}
.maxwidth450{ max-width: 450px; min-width: 310px;}
.minwidth90{ min-width: 90px; }
.minwidth-date{ min-width: 132px;  }
.minwidth110 {
    min-width: 110px;
    display: inline-block;
}
.oldval{font-size: 12px;font-weight: bold; padding: 2px; display: inline-block; color: #fff;}
.color-red, .red{color: red !important; font-weight: bold;}
.color-1{ color:var(--color-1) !important; font-weight: bold;}
.color-2{ color:var(--color-2) !important; font-weight: bold;}
.color-3{ color:var(--color-3) !important; font-weight: bold;}
.color-4{ color:var(--color-4) !important; font-weight: bold;}
.color-5{ color:var(--color-5) !important; font-weight: bold;}
.color-6{ background-color:var(--color-6) !important; font-weight: bold; color: #fff;}
.color-7{ color:var(--color-7) !important; font-weight: bold;}
.color-8{ background-color:var(--color-8) !important; font-weight: bold; color: #fff;}
.color-9{ color:var(--color-9) !important; font-weight: bold;}
.bg-color-1{ background-color:var(--color-1) !important; font-weight: bold;}
.bg-color-2{ background-color:var(--color-2) !important; font-weight: bold;}
.bg-color-3{ background-color:var(--color-3) !important; font-weight: bold;}
.bg-color-4{ background-color:var(--color-4) !important; font-weight: bold;}
.bg-color-5{ background-color:var(--color-5) !important; font-weight: bold;}
.bg-color-6{ background-color:var(--color-6) !important; font-weight: bold;}
.bg-color-7{ background-color:var(--color-7) !important; font-weight: bold;}
.bg-color-8{ background-color:var(--color-8) !important; font-weight: bold;}
.bg-color-9{ background-color:var(--color-9) !important; font-weight: bold;}
.hsrp-sign.color-0{ color:var(--color-3) }

/***NP pending status color**/
.pending-status-color-1 { color:var(--color-party_approval_pending); }
.pending-status-color-2 { color:var(--color-6); }

span.rto-heading b {
  padding: 3px 5px;
  color: #fff;
}
.logoColor {
	color: #f76d2b !important;
	fill: #f76d2b !important;
	font-size: 25px;
	font-weight: bold;
}

.logoColor span {
	color: #545454 !important;
}

.card {
	padding-bottom: 10px;
}

.card-header a h5 {
	color: #312f2f;
	font-size: 14px;
	font-weight: bold;
	padding: 8px 10px;
	background-color: #9ccae4;
	float: left;
	width: 100%;
}

.card-header a h5 i {
	float: right;
}

.select2-selection {
	height: 34px !important;
}

/* Custom Checkbox CSS start Here */
.custom-checkbox {
	position: relative;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.custom-checkbox-label {
  color: #000;
  position: absolute;
  font-style: normal;
  font-weight: normal;
}
/* 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: 0px;
	left: 0px;
	height: 16px;
	width: 16px;
	background-color: #efecec;
	border: 1px solid gray;
	border-radius: 2px;
}

/* On mouse-over, add a grey background color */
.custom-checkbox:hover input ~ .checkmark {
	background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.custom-checkbox input:checked ~ .checkmark {
	background-color: #0ea1f7;
	border: 1px solid #0ea1f7;
}

.custom-checkbox input:disabled ~ .checkmark {
	cursor: not-allowed;
}

/*.custom-checkbox.color1 input:checked ~ .checkmark {
    background-color: #c5b143;
}*/

/* Create the checkmark/indicator (hidden when not checked) */
.custom-checkbox .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: 5px;
	top: 1px;
	width: 5px;
	height: 8px;
	border: solid white;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

/* Custom Checkbox CSS ends Here */

.app-or-pending {
	display: block;
	margin-top: 5px;
	text-align: center;
	font-size: 16px;
}

/***** Tooltip */
#disabled-button-wrapper {
	display: inline-block;
	/* display: block works as well */
}

#disabled-button-wrapper .btn[disabled] {
	/* don't let button block mouse events from reaching wrapper */
	pointer-events: none;
}

/*varinder 15-03-2020*/
/* Switch Button */
.switch {
	position: relative;
	float: left;
	width: 50px;
	height: 25px;
	margin-bottom: 0px;
	margin-right: 10px;
}

.switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

.switch .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #f6dbda;
	-webkit-transition: .4s;
	transition: .4s;
}

.switch .slider:before {
	position: absolute;
	content: "";
	height: 20px;
	width: 20px;
	left: 4px;
	bottom: 3px;
	background-color: #ba3e3b;
	-webkit-transition: .4s;
	transition: .4s;
	box-shadow: 1px 0 3px #ba3e3b;
}

.switch input:checked + .slider {
	background-color: #c1e2c6;
}

.switch .switch input:focus + .slider {
	box-shadow: 0 0 1px #2196F3;
}

.switch input:checked + .slider:before {
	background-color: #2aab3c;
	box-shadow: -1px 0 3px #2aab3c;
	-webkit-transform: translateX(21px);
	-ms-transform: translateX(21px);
	transform: translateX(21px);
}

/* Rounded sliders */
.switch .slider.round {
	border-radius: 34px;
}

.switch .slider.round:before {
	border-radius: 50%;
}

.company_user_modal {
	padding: 4px 10px !important;
	font-size: 14px !important;
}

.modal-body {
	position: unset;
	width: 100%;
	float: left;
}

button.close {
	padding-right: 5px !important;
	font-size: 24px;
}

.modal_empty_data {
	text-align: center;
}
form-control.error{

	border: 1px solid #f00;
}
label.error{
	color: #f00;
	font-size: 14px;
	font-weight: 500;
}
.required,
.help-block {
	color: #f00;
}

.panel-heading {
	width: 100%;
	float: left;
}

.nav.nav-pills {
	float: left;
}

.contact_details {
	padding-top: 10px;
}

.panel-body {
	width: 100%;
	clear: both;
}

.login_description {
	width: 100%;
	float: left;
	margin-top: -17px;
	padding-left: 15px;
}

.margin_0 {
	margin: 0px;
}


.dataTables_wrapper {
	padding: 15px;
}
 .dataTables_wrapper .dataTables_paginate li.paginate_button {
  display: inline !important;
  padding: 0px  !important;
}
label.error {
	font-weight: normal;
	color: #f00;
}

#add_staff_form span {
	color: red;
}


/*****  Profile View  *****/

.profile-view-info-header h4,
.profile-view-info-header .h4 {
	font-weight: 700;
	margin-top: 0;
}

.profile-view-info-ul {
	list-style: none;
	display: inline-block;
	vertical-align: top;
	margin: 0;
	padding: 0;
}

.profile-view-info-ul li {
	float: left;
	margin-right: 20px;
	font-size: 13px;
	margin-top: -6px;
}

.profile-view-info-box {
	position: relative;
	padding-left: 40px;
	font-size: 15px;
	line-height: 1.8;
	margin: 10px 0 10px;
}

.profile-view-info-box figure {
	position: absolute;
	left: 0;
	top: -4px;
	width: 34px;
}

.profile-view-info-box figure img {
	width: 100%;
}

.profile-view-info-body h5,
.profile-view-info-body .h5 {
	font-size: 16px;
	font-weight: 700;
}
.cyan-blue-text{
	color: #3c8dbc;
}
.table {
	border: 1px solid #68afd9;
}

.table th,
.table td {
	border: 1px solid #68afd9;
	text-align: center;
	vertical-align: middle !important;
}

.table thead th {
	background-color: #3c8dbc;
	font-size: 14px;
	color: #fff;
	text-transform: uppercase;
}

.table td {
	font-size: 13px;
}

.table th label,
.table td label {
	display: block;
	margin-bottom: 0;
	font-style: italic;
}

.table .thead-light th {
    color: #495057;
    background-color: #f5f5f5;
}
.change-company-wrapper {  
	padding: 5px;
  display: flex;
  border: 2px solid #3c8dbc;
}
.change-company-button { margin-left:10px;  }
.change-company-button button{ padding: 3px 12px;  }
.form-control-label{
	width: 100%;
	height: 36px;
	padding: 6px 12px;
	background-color: #fff;
	background-image: none;
}
/**********Table layout using DIV***************/
.customtable{
  display:table;
  border-collapse:separate;
  border: 1px solid #ddd;
}
.customtable .thead{
  display:table-header-group;
  font-weight:bold;
  background-color: #3c8dbc;
  font-size: 14px;
  color: #fff;
  text-transform: uppercase;
}
.customtable .thead .td {
  padding: 5px;
}
.customtable .tbody{
  display:table-row-group;
}
.customtable .tr{
  display:table-row;
}
.customtable .td{
  display:table-cell;
  border:1px solid #ddd;
  padding:1px 5px;
}
table th.sorting{cursor: pointer;}
/****Custom Buttons****/
.btn-group.actionbuttons button {
  margin-right: 6px;
}
.btn-purple {
  color: #fff;
  background-color: var(--color-1) !important;
  border-color:  var(--color-1) !important;

}
.btn-purple:active, .btn-purple:hover {
  background-color: #673ab7 !important;
  color: #fff;
}
.bg-purple {
    background-color: var(--color-1) !important;
    color: #fff;
    font-weight: bold;
}

/*********Job orders*************/
body.admin .displaytoadmin{
	display: block !important;
}
#showjoborderInfo tr td{ padding: 10px; }
#showjoborderInfo tr th{ padding: 5px; }
#showjoborderInfo tr td:last-child{min-width: 80px}
#showjoborderInfo tr td a, #showjoborderInfo tr td{ color: #fff;  }
#showjoborderEmail tr td{ padding: 10px; }
#showjoborderEmail tr th{ padding: 5px; }
#showjoborderEmail tr td:last-child{min-width: 80px}
#showjoborderEmail tr td a, #showjoborderEmail tr td{ color: #fff;  }
input#jobordersendemail { margin-top: -51px;}
#showjoborderEmail .custom-checkbox .checkmark{ top: -8px; }
table tr.empty{ background-color:var(--color-empty); }
table tr.money_due_withheld{ background-color:var(--color-money_due_withheld); }
table tr.money_due_processed{ background-color:var(--color-money_due_processed);}
table tr.partial_payment{ background-color: var(--color-partial_payment);}
table tr.partial_payment_withheld{ background-color: var(--color-partial_payment_withheld);}
table tr.paper_pending{ background-color: var(--color-9); }
table tr.full_payment{ background-color: var(--color-full_payment);}
table tr.work_completed_waiting_for_fund{ background-color: var(--color-work_completed_waiting_for_fund); }
table tr.work_completed_and_dispatched{ background-color: var(--color-work_completed_and_dispatched);}
table tr.document_pending{ background-color: var(--color-document_pending); }
table tr.money_recived_paper_pending{ background-color: var(--color-money_recived_paper_pending); }
table tr.over_month{ background-color: var(--color-7); }
table tr.challan_blacklist{ background-color: var(--color-6); }
table tr.party_approval_pending{ background-color: var(--color-party_approval_pending); }
.empty{ color:var(--color-empty); }
.money_due_withheld{ color:var(--color-money_due_withheld); }
.money_due_processed{ color:var(--color-money_due_processed);}
.partial_payment{ color: var(--color-partial_payment);}
.partial_payment_withheld{ color: var(--color-partial_payment_withheld);}
.paper_pending{ color: var(--color-9); }
.full_payment{ color: var(--color-full_payment);}
.work_completed_waiting_for_fund{ color: var(--color-work_completed_waiting_for_fund); }
.work_completed_and_dispatched{ color: var(--color-work_completed_and_dispatched);}
.document_pending{ color: var(--color-document_pending); }
.money_recived_paper_pending{ color: var(--color-money_recived_paper_pending); }
.over_month{ color: var(--color-7); }
.challan_blacklist{ color: var(--color-6); }
.party_approval_pending{ color: var(--color-party_approval_pending); }
/********Vertical Left Tabs***********/
.tabs-left{
  border-bottom: none;
  padding-top: 2px;
}
.tabs-left {
  border-right: 1px solid #3c8dbc;
}
.tabs-left>li {
  float: none;
  margin-bottom: 2px;
}
.tabs-left>li {
  margin-right: -1px;
}
.tabs-left>li.active>a,
.tabs-left>li.active>a:hover,
.tabs-left>li.active>a:focus {
  border-color: #3c8dbc;
  border-right-color: transparent;
  font-weight: bold;
}
.tabs-left>li>a {
  border-radius: 4px 0 0 4px;
  margin-right: 0;
  display:block;
	padding: 8px;
}
/*****RTO WORK********/
.waa-rto-detail{
	clear: both;
	width: 90%;
}
ul.rto-details{
	padding-left: 15px;
	word-break: break-all;
}
ul.rto-details li{
  border-bottom: 1px solid #d3e0e9;
}
ul.rto-details li:last-child{
	border-bottom: none;
}
.any-rto-delete{
margin-right: 15px;
}
.date_disp_pos {
	position: relative;
	left: 13px;
	top: 0px;
}

.badge-danger{
	background-color: red !important;
}

.customerListingTab{
	margin-bottom: 10px;
}

/******Activity Logs******/
.activity-logs-table tr td {
 word-break: break-word;
}


/**Ticket CSS**/
.showTicketsInfo.text-center th,
.showTicketsInfo.text-center td {
	text-align: center;
}
.ticket-message-title {
	margin-top: 0 !important;
}
.message_container.ticket-message {
	background-color: #eee;
	padding: 0;
}
.message_container.ticket-message.darker {
	background-color: #fff;
}
.message_container.ticket-message .header {
	padding: 15px 10px;
	background-color: #dedede;
}
.message_container.ticket-message.darker .header {
	background-color: #bbdff3;
}
.message_container.ticket-message .header .comment_by {
	padding: 0;
	font-size: 16px;
	line-height: 1.5;
	text-align: left;
	margin-top: 5px;
}
.message_container.ticket-message .header .comment_by:hover {
	background-color: transparent;
}
.message_container.ticket-message .header .comment_by span {
	display: block;
	font-size: 14px;
	color: #666;
}
.message_container.ticket-message .header .header-right {
	text-align: right;
}
.message_container.ticket-message .header .header-right .btn {
	margin-left: 10px;
}
.message_container.ticket-message .ticket-message-body {
	padding: 15px 15px 0 15px;
	word-break: break-all;
}
.ticket-status-dtl-list strong {
	display: block;
}
.ticket-vehicle-list {
	margin-left: 18px;
	padding: 0;
}
.dropdown-multiple-label .dropdown-display-label {
	padding: 0;
}
#TicketSubmitForm textarea.form-control {
	resize: none;
}
#TicketSubmitForm .form-control {
	box-shadow: none !important;
}
.viewtickets .panel-default .panel-heading .btn,
.viewtickets .panel-default .panel-heading .btn-group {
	margin-left: 10px;
}
.viewtickets .panel-default .panel-heading .btn-group .btn {
	margin-left: 0;
}
.message_container.ticket-message .header .header-right .btn {
	margin-left: 10px;
}
span.dropdown-search {
    width: 100%;
}
.dropdown-chose-list {
    width: 100%;
}
table.showTicketsInfo th, table.showTicketsInfo td, table#attentionvehicles th, table#attentionvehicles td{
	border: 1px solid #C8C8C8;
}
.unchecked{
font-weight: normal;
}
/* .showVechAttwithfilterClick, .js-showVechAtt {
  display: none;
} */
div#showTicketsInfo_wrapper {
	margin: 12px 0 0 0;
}

.nav-tabs>li>a {
	border: 1px solid #ddd;
	margin-top: 10px;
}

.StatusForm .form-control[disabled],.supp_ticket .form-control[disabled]{
	border: 1px solid #2a88bd;
	background-color: var(--color-3);
	color: #fff;
}

/*Border Class*/
.border {
  border: 1px solid #dee2e6!important;
}
.border-top {
  border-top: 1px solid #dee2e6!important;
}
.bottom {
  border-bottom: 1px solid #dee2e6!important;
}