html {overflow-x: hidden;
		transition: all 0.3s ease;color-scheme:light  !important;}
		
body {padding:0;margin:0;font-family:"Barlow",sans-serif;
		transition: all 0.3s ease;}
	a {text-decoration:none;color:unset;}
div,h1,h2,h3,h4,p,i,a {position:relative;
		transition: all 0.3s ease;}

	* {    font-size: 18px;
    transition: 0.2s;
    font-weight: 600;}
form,input,textarea,select {font-family:"Barlow",sans-serif;
		transition: all 0.3s ease;}
:root {
	--color:#848484;
	--color2:#64af35;
}
/*alerts */
div,h1,h2,h3,h4,p,i,a,footer {position:relative;
		transition: all 0.3s ease;}

input,select,textarea,button {font-family: "Barlow",sans-serif;}

a {    text-decoration: unset;
    color: unset;}

input::placeholder,textarea::placeholder {font-size:12px}

/*scroll bar*/
	/* 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; 
}
::placeholder {font-style:italic}

	

	
	.back_button_main {display:none;}	

.login {            color: white;
    width: -webkit-fill-available;
    background: #040e45;
    height: auto;
    margin: 0% auto;
    box-shadow: 0px 0px 10px 0px #00000024;
    border-radius: 0px;
    padding: 50px;
    height: 100vh;}


.login h1{       margin: 1rem;
    font-weight: 500;
    color: #181818;
    letter-spacing: -2px;}
.login p{        font-size: 13px;
    max-width: 400px;
    margin: 19px auto;
    position: relative;
    display: block;
   }
.login form{margin: 0px 0px 5px;}
.login form a{       font-size: 14px;
    margin: 9px 0px;
    position: relative;
    font-weight: 500;
    cursor: pointer;
    color: #ffffff;
    padding: 7px;
    border-radius: 19px;
    max-width: 400px;
    margin: 20px auto;
    display: block;}
.login form input{        width: -webkit-fill-available;
    border: 0px;
    padding: 12px 30px;
    margin: 5px;
    font-size: 18px;
    border-radius: 5px;
    background: #ffffff;
    outline: none;
    max-width: 400px;
    display: block;
    margin: 17px auto;
}
.login form input[type=submit]{background: #4CAF50;
    color: white;
    border: 0px;
    padding: 10px;}
	
	.login img {        width: -webkit-fill-available;
    max-width: 250px;
    margin: 15px auto;
    display: block;}
#forgotpage {display:none;}

.dt-search {    
    width: fit-content;
    padding: 10px;}
	
.dt-paging {    margin: 0 auto;
    display: block;
    width: fit-content;
    padding: 10px;}
	
	.dashboard {      
         width: 100vw;
    height: 100vh;
    display: grid;
    grid-template-columns: 20% 80%;}
	
	.dashboard .dash_side1{   
             background: #00189f;
    color: #ffffff;
    height: 100vh;
    }
	
	.dashboard .dash_side1 .dash_min{        padding: 6px;
    position: absolute;
    right: 2px;
    background: #0e27b7;
    width: 22px;
    top: 3px;
    text-align: center;
    border-radius: 4px;
    z-index: 3;
    font-size: 25px;
    color: white;
    border: 1px solid white;}
	
	.dash_nav{       margin-top: 53px;
    min-height: 88vh;
    overflow: hidden;
    overflow-y: auto;
    height: 88vh;}
	
	 .dash_nav .nav_list{         font-size: 1rem;
    display: grid;
    grid-template-columns: 80% auto;
    padding: 6px 12px 6px 12px;
    margin: 2px 0px;
    user-select: none;
    border-bottom: 1px solid #243cc7;
	}
	.dash_nav .nav_list:hover, .dash_nav .active {
		              background: #ffffff;
    transition: 0.2s;
    color: #000000;
	}
	
	.dash_nav .nav_list:hover .nv_tx {
		left:10px;transition:0.2s;
	}
	
	
	.dash_nav .nav_list .nv_tx {left:0px;transition:0.2s;}
	.dash_nav .nav_list i {}
	 
	 
	 .dash-collapse {    grid-template-columns: 5% 95%;}
	 .dash-collapse .dash_nav .nav_list .nv_tx {
    left: 0px;
    display: none;
    transition: 0.2s;
}
	
	footer p {      text-align: left;
    margin: 0px;
    padding: 6px 14px;
    font-size: 14px;
    white-space: nowrap;}
	
	 
	.dashboard .dash_side2{      
    height: 100vh;
    overflow-y: auto;}
	
	.title {          display: grid;
    grid-template-columns: 50% 50%;
    align-items: center;
    
   }
	.title h3{      font-size: 30px;
    margin: 10px 2rem;
    left: 30px;}
	.user_pro_top{    font-size: 15px;
    font-weight: 500;
    text-align: right;
    padding: 16px;}
	
	.dash_box {          min-width: 150px;
    margin: 5px;
    display: inline-block;
    padding: 1rem;
    border: 1px solid;}
	
	
	.dash_box:hover {
		transition:0.4s; scale:0.98;
	}
	.dash_box img {      width: 30px;
    height: auto;
    margin: 0px 10px;}
	.dash_box i{      font-size: 24px;
    padding: 3px 1rem;}
	
	.dash_box .dash_value{       font-size: 2rem;
    padding: 5px 1rem;
    font-weight: 600;}
	
	.dash_box .dash_dis {       font-size: 1rem;
    padding: 10px 1rem 5px;
    font-weight: 500;
    }
	
	.dash_box .fa-users {    color: #3F51B5;}
	.dash_box .fa-address-card-o {      color: #4CAF50;}
	.dash_box .fa-edit {      color: #0b93ff;}
	.dash_box .fa-clock-o {      color: #FF5722;}
	.dash_box .fa-exclamation-triangle {      color: #ff0303;}
	.dash_box .fa-rupee {      color: #009688;}
	
	
	.title2 {          padding: 1rem;
    font-size: 25px;
    font-weight: 500;
    border-bottom: 0px solid #000000;
    margin: 0rem 1rem;}
	
	.form_block {          margin: 10px auto;
    width: -webkit-fill-available;
    max-width: 1000px;
    text-align: left;}
	
	.input_area {               border: 1px solid #aaaaaa;
    margin: 7px auto;
    border-radius: 3px;
    width: -webkit-fill-available;
    max-width: 800px;
    display: grid;
    vertical-align: top;
    grid-template-columns: 20% auto;}
	
	
	.input_area p{           margin: 0px;
    padding: 2px 7px;
    font-size: 14px;
    text-align: left;
    align-items: center;
    background: #82828217;
    display: flex;
    font-weight: 600;
    border-right: 2px dotted #b7b7b7;}
	
	.input_area input,.input_area textarea,.input_area select {       border: 0px;
    width: -webkit-fill-available;
    padding: 9px;
    font-size: 20px;
    outline: none;
    text-align: left;
    font-weight: 500;}
	
	.input_grid2 {    display: grid;
    grid-template-columns: 80px auto;text-align: left;}
	
	.radio_grid {    display: flex;}
	.radio {    padding: 10px;}
	.radio p{}
	
	.form_title2 {          color: black;
    padding: 10px 20px;
    margin: 10px;
    text-align: left;
    font-weight: 600;
    border-bottom: 1px solid #000000;}
	
	.title_num {    width: fit-content;
    display: inline-block;
    background: white;
    color: black;
    padding: 2px;
    min-width: 20px;
    text-align: center;
    margin: 0px 6px;
    font-weight: 600;}
	
	
	.m_status_css1,.m_status_css2 {display:none;}
	
	.submit_btn {            width: -webkit-fill-available;
    margin: 10px;
    padding: 12px;
    font-size: 18px;
    font-weight: 600;
    background: #469649;
    color: white;
    border: 0px;
    border-radius: 3px;
    max-width: 500px;
    z-index: 3;
    display: block;
    position: relative;
    margin: 10px auto;}
	
	#add_input_btn {          border: 1px solid;
    padding: 10px;
    display: inline-block;
    background: green;
    color: white;
    cursor: pointer;
    width: 29px;
    border-radius: 4px;
    vertical-align: middle;
    top: auto;
    margin-top: 10px;}
	
	.next_btn,.later_btn {    width: -webkit-fill-available;
    max-width: 250px;
    display: inline-block;
    background: #2238b7;
    color: white;
    padding: 10px;
    margin: 1rem;
    text-align: center;
    border-radius: 2px;}
	
	.later_btn {    color: black;
    background: #bcbcbc;}
	
	
	.submit_btn:hover {
		scale:0.95;
		transition: all 0.3s ease;
	}
	
	.created,.pending,.working,.complete {   
		padding: 4px;
		text-align: center;
		font-size: 11px;
		border-radius: 3px;
		 background: #FF9800;
		color: white;
    }
	.pending{ background: #ff0000;}
	.working{ background: #2196F3;}
	.complete{ background: #4CAF50;}
	
	.alert {    width: -webkit-fill-available;
    padding: 1rem;
    max-width: 500px;
    margin: 5px auto;
    border-radius: 1px;}
	
	.success {    background: #d3ffd5;
    color: #0c4810;}
	.info {    background: #E3F2FD;
    color: #0D47A1;}
	.danger,.failed {background: #f3dede;
    color: #8d1414;}
	
	
	#close_nav_popup {    font-size: 20px;
    position: absolute;
    right: 29px;
    top: 18px;
    z-index: 3;}
	.user_logo {        display: block;
    margin: 10px  2rem;
    border: 1px solid gray;
    max-width: 300px;
    max-height: 200px;}
	
	.buttons-html5 {    display: inline-block;
    background: green;
    color: white;
    padding: 7px;
    font-size: 14px;
    border: 0px;
    margin: 5px;}
	
	.dt-buttons {    width: fit-content;
    vertical-align: top;display: inline-block;
    margin: 0px;}
	
	label[for=dt-length-0] {    font-size: 11px;color:gray;}
	
	.dt-length {    width: 100px;
    display: inline-block;
    margin: 5px;
    vertical-align: top;}
	
	.dt-search {         display: inline-block;
    vertical-align: top;
    margin: 2px;
    top: 7px;}
	
	table.dataTable>tbody>tr>th, table.dataTable>tbody>tr>td {
                 padding: 2px 6px;
    font-size: 18px;
    max-width: 100px;
    overflow: auto;
    font-weight: 600;
}

table.dataTable thead th, table.dataTable tfoot th {
    font-weight: bold;
    font-size: 12px;
}

table.dataTable>tbody>tr:nth-child(2n+2){
	       background: #dadada6e;
}

table.dataTable>tbody>tr>th, table.dataTable>tbody>tr>td::-webkit-scrollbar {
  height: 3px;
} 

#myTable_info {    font-size: 12px;
    padding: 10px;}

.rejected {    background: #ff3434;
    color: white;
    padding: 2px 4px;
    font-size: 12px;
    margin: 0px 0px 3px;}

.pending {    background: #FF9800;
    color: white;
    padding: 2px 4px;
    font-size: 12px;
    margin: 0px 0px 3px;}
	
	.approved {    background: #4CAF50;
    color: white;
    padding: 2px 4px;
    font-size: 12px;
    margin: 0px 0px 3px;}
	
	
	table tbody tr td .fa-trash {    color: white;
    background: #b90606;
    padding: 6px;
    margin: 0 auto;
    display: block;
    width: fit-content;
    border-radius: 2px;}
	table tbody tr td .fa-edit,table tbody tr td .fa-rupee ,table tbody tr td .fa-print,table tbody tr td .fa-history ,table tbody tr td i{       color: white;
    background: #2196F3;
    padding: 6px;
    margin: 2px 4px;
    display: inline-block;
    width: fit-content;
    border-radius: 2px;}
	
	
	
	 table tbody tr td .fa-rupee {    background: #13ab13;}
	 table tbody tr td .fa-print {    background: #13ab13;}
	 table tbody tr td .fa-history {    background:gray;}
	 table tbody tr td .fa-phone {    background:#FF5722;}
	 table tbody tr td .fa-whatsapp {    background:#13ab13;}
	
	.poi_class {        max-width: 500px;
    height: auto;
    max-height: 100px;
    margin: 10px auto;
    display: block;}
	
	
	.open_image {         padding: 5px 10px;
    display: block;
    background: #3F51B5;
    font-weight: 600;
    font-size: 12px;
    color: white;
    text-align: center;
    margin: 3px;
    border-radius: 3px;}
	
	.add_btn2 {    background: green;
    color: white;
    padding: 8px;
    text-align: center;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;}
	.popup_confirmation {     color: white;
    position: absolute;
    top: 50%;
    left: 50%;
    background: #000000;
    min-width: 300px;
    min-height: auto;
    max-width: -webkit-fill-available;
    text-align: center;
    border: 0px solid gray;
    z-index: 2;
    padding: 10px 0px 25px;
    transform: translate(-50%,-50%);scale:0;user-select:none;}
	.popup_title {    font-size: 20px;
    padding: 20px;}
	.btn_yes {    background: red;
    color: white;
    padding: 10px;
    width: 100px;
    margin: 10px;
    display: inline-block;}
	.btn_no {      background: #6d6565;
    color: white;
    padding: 10px;
    width: 100px;
    margin: 10px;
    display: inline-block;}
	
	.btn_no:hover , .btn_yes:hover {
		scale:0.96;
	} 
	
	.active_popup {
		    animation: popcon 0.2s linear forwards;
    transform-origin: top;
		
	}
	
	@keyframes popcon {
		0%{scale:0;}
		100%{scale:1;}
	}
	
	.btn_flex {    display: flex;
    justify-content: space-around;}
	
	.color-blue {    color: blue;}
	.color-red {    color: #dc1414;}
	.color-green {    color: green;}
	.center {text-align:center !important; }
	
	.bold {    font-weight: 600;}
	
	.disable {    background: #f1f1f1;
    border: 0px;}
	
	.chosen-container-single .chosen-single {     box-shadow: unset;
    border: 0px;
    padding: 10px;
    height: auto;
    background: transparent;
    text-align: left;
    font-size: 16px;
    font-weight: 500;}
	
	#password_btn {    font-size: 12px;
    padding: 4px 7px;
    display: block;
    color: black;
    font-weight: 700;}
	
	.nav_category {    padding: 10px 0px;}
	.nav_category h3{       margin: 1px 1rem;
    font-weight: 400;
    font-size: 15px;
    padding: 5px 0px;}
	.nav_cat_btn {      padding: 5px 10px;
    margin: 6px;
    font-weight: 500;
    border: 1px solid #e6e6e6;
    border-radius: 24px;}
	
	.nav_cat_btn:hover { border: 1px solid #000000;}
	
	.flex {    display: flex;}
	.nav_cat_btn_active {border:1px solid black;background:black;color:white;}
	
	#jobCardPopup {      display: none;
    position: fixed;
    background: #081c91;
    padding: 2rem;
    z-index: 3;
    color: #ffffff;
    display: none;
    align-items: center;
    border: 1px solid;
    font-size: 1rem;
    width: 95%;
    max-width: 500px;
    text-align: center;
    border-radius: 7px;
    min-height: 200px;
    left: 50%;
    top: 32%;
    transform: translate(-50%,-50%);}
	#jobCardPopup p{    margin: 0px;
    text-align: left;
    left: 20px;}
	#jobCardPopup input{  
	    width: -webkit-fill-available;
    padding: 10px;
    border-radius: 5px;
    margin: 1rem 0rem;
    border: 0px;
    font-size: 22px;
    text-transform: uppercase;
    font-weight: 500;
	}
	#jobCardPopup button{    background: #FF5722;
    color: white;
    padding: 10px;
    width: -webkit-fill-available;
    margin: 0px 1rem;
    border: 0px;
    font-size: 18px;
    border-radius: 3px;}
	
	.jobcard_btn {    background: #FF5722;
    padding: 10px;
    margin: 10px;cursor:pointer;}
	
	.call_btn,.wtsp_btn {      display: block;
    position: fixed;
    z-index: 3;
    background: #FF5722;
    color: white;
    padding: 5px;
    font-size: 30px;
    border-radius: 100px;
    right: 7px;
    bottom: 75px;
    left: unset;
    height: 40px;
    width: 40px;
    border: 1px solid;
    text-align: center;
    display: grid;
    align-items: center;}
	
	.wtsp_btn {   
        background: #149314;
    color: white;
    bottom: 25px;}
	
	.spare_parts {     width: -webkit-fill-available;
    max-width: 800px;
    margin: 0 auto;
    padding: 0px;}
	.spare_parts p{      margin: 0px;
    font-weight: 600;
    font-size: 14px;
    padding: 10px 0px 0px;}
	.spare_parts h3{      font-size: 20px;
    margin: 0px;
    padding: 10px;
    margin-top: 35px;}
	.sp_input {         display: grid;
    grid-template-columns: 5% 30% 30% 20% 15%;
    align-items: center;
    background: transparent;
    margin: 10px 0px;
    border: 1px solid #8e8e8e;
    border-radius: 3px;}
	
	.sp_input select{   
        font-size: 16px;border-right: 1px solid gray;}
	
	.sr_no {    text-align: center;
    font-size: 12px;
    background: #efefef;
    border-radius: 14px;
    width: 15px;
    padding: 2px;}
	
	.sp_input input,.sp_input select,.sp_input textarea{    
	                        height: fit-content;
    margin: 0px 3px;
    padding: 12px 11px;
    border-radius: 0px;
    outline: none;
    border: 0px;
    font-size: 20px;
    border-right: 1px solid gray;
    font-weight: 500;}
	.sp_input img   {      width: 34px;
    max-height: 150px;
    border: 2px solid black;
    border-radius: 21px;
    margin: 2px auto;
    display: block;}
	
	.add_btn {    background: #FF5722;
    color: white;
    padding: 6px;
    font-size: 13px;
    width: fit-content;
    position: absolute;
    right: 62px;
    z-index: 3;
    top: 12px;cursor:pointer;}
	
	.mechanic_work_history {      display: grid;
    grid-template-columns: 40% 30% 30%;
    max-width: 792px;
    margin: 2px auto;
    border: 1px solid gray;
    padding: 6px;
    font-size: 14px;}
	
	.print_btn {    background: #E91E63;
    color: white;
    padding: 7px 20px;
    font-size: 14px;
    margin: 0px;}
	
	.pending_service {    color: red;
    font-weight: 600;}
	.nav_category{    padding: 10px 0px 0px;}
	
	.nav_category h3 {
    margin: 1px 1rem;
    font-weight: 600;
    font-size: 15px;
    padding: 7px 0px;
}
	.filter_form {        display: flex;
    max-width: 500px;
    width: -webkit-fill-available;
    justify-content: space-evenly;
    align-items: center;
    flex-wrap: wrap;}
	.filter_form input,.filter_form select{    width: fit-content;
    padding: 6px;
    border-radius: 3px;
    font-size: 14px;
    
    border: 1px solid #d3d3d3;}
	.filter_form select{}
	.filter_form button{    font-size: 14px;
    padding: 7px 12px;
    border: 0px;
    background: #242424;
    color: white;
    font-weight: 500;
    border-radius: 3px;}
	
	div.dt-container .dt-input {
    border: 1px solid #aaa;
    border-radius: 3px;
    padding: 5px;
    background-color: transparent;
    color: inherit;
    width: auto;
}
.grid-3 {    grid-template-columns: 9px 33% 33% 33%;}

#jc_result input:user-invalid {border:2px solid red;}
#jc_result input:user-valid {border:2px solid green;}

.popup_message {          position: relative;
    z-index: 22;
    background: #000000;
    color: white;
    padding: 10px;
    text-align: center;
    width: -webkit-fill-available;
    max-width: 400px;
    min-height: 200px;
    border-radius: 10px;
    top: unset;
    left: unset;
    transform: unset;
    width: 94% !important;
    max-width: 500px;
    margin: 10px auto;}
	
	.popup_message  h3 {       margin: 0px;
    text-align: center;
    padding: 20px;}
	.popup_message textarea{    height: 0px;
    padding: 0px;
    border: 0px;
    width: 0px;
    margin: 0px;}
	.popup_message button{       width: -webkit-fill-available;
    max-width: 150px;
    padding: 10px;
    margin: 25px 11px;
    background: white;
    color: black;
    font-size: 20px;
    border: 0px;
    border-radius: 6px;}
	.popup_message button .fa-comment{}
	.popup_message button .fa-whatsapp{}
	
	.send_notification {    background: black;
    color: white;
    padding: 8px;
    font-weight: 600;
    margin: 10px auto;
    display: block;}
	
	.pagination {      margin-bottom: 10px;
    width: -webkit-fill-available;
    text-align: center;
    display: grid;
    justify-content: center;
    overflow: auto;
    grid-template-columns: auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto;}
	.page_btn {       text-align: center;
    min-width: 20px;
    width: fit-content;
    margin: 10px 2px;
    background: #c2c2c2;
    color: #000000;
    padding: 5px;}
	.pagination .active{  
    background: #000000;
    color: white;
    }
	
	.dt-paging {display:none;}
	
	
	.user_payment_row {       display: flex;
    justify-content: space-around;
    border: 1px solid;
    padding: 2px;
    max-width: fit-content;
    float: unset;
    border: 0px;
    margin: 10px auto;}
	
	.user_payment_row input {       padding: 9px;
    font-size: 20px;
    font-weight: 700;
    border: 1px solid #8c8c8c;
    margin: 5px 0px;
    border-radius: 3px;}
	.user_payment_row input[type=submit] {    padding: 10px 7px;
    background: #4CAF50;
    color: white;border:0px;}
	
	.kharadiya,.denter,.mechanic,.worker {display:none;}
	
	.vehicle_list_on_search {}
	.vehicle_list_on_search li{       text-align: left;
    padding: 10px;
    border: 1px solid;
    margin: 4px;
    background: #0000004d;
    color: #ffffff;
    list-style: none;
    text-transform: uppercase;}
	
	.uppercase {text-transform: uppercase;}
	.red {color:red;}
	.green {color:green;}
	
	.popup_msg_main {    display:none;background: black;
    color: white;
    padding: 1rem;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border: 1px solid;
    border-radius: 9px;
    width: 90%;
    max-width: 500px;
    text-align: center;}
	
	.popup_msg_main textarea {        background: transparent;
    color: white;
    border: 0px;
    width: -webkit-fill-available;
    overflow: overlay;
    height: 300px;}
	
	.popup_msg_main  button{    background: #03A9F4;
    color: white;
    padding: 10px 20px;
    margin: 8px 10px;}