@import url("https://use.fontawesome.com/releases/v5.15.4/css/all.css");


@charset "UTF-8";
/* CSS Document */

body {
    background-color: #fff;
    overflow-x: hidden;
}
a:hover{text-decoration: none;}
input:focus,
textarea:focus {
  outline: none !important;
}
.btn:hover, .btn:focus {
    background-color: #fff;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.16) !important;
}
button:focus,
a:focus {
  outline: none !important;
  color: #333;
  box-shadow: none !important;
}
header{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  z-index: 1020;
  transition: all ease .3s;
}
.ui-widget.ui-widget-content {
	z-index: 98 !important;
}
.header-top{
    position: fixed;
    width: 100%;
    height:auto;
    background-color: #fff;
    z-index: 9;
    top:0;
    left:0;
}
.logo{
    padding: 10px 0;
}
.menu{
    margin: 50px 0;
}
.menu ul {
    float: right;
}
.menu ul li {
    font-family: Arial, sans-serif;
    text-transform: uppercase;
    display: inline;
    padding: 0 0 0 20px;
}
.menu ul li a{
    font-size: 14px;
    font-weight: 600;
    color: #003169;
}
.menu ul li a:hover{
    text-decoration: none;
    color: #0057b9;
}
.banner {
    background-image: url(../img/banner.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 550px;
    margin: 0 25px;
}
.banner-content{
    padding: 200px 0 80px;
}

/* Toast Notification Styles (moved from master.blade.php) */
.toast-container {
  position: fixed;
  top: 80px;
  right: 0px;
  z-index: 8888;
  max-width: 400px;
  width: 100%;
}

.toast-notification {
  background: linear-gradient(to right, #1e3a8a 0%, #1e40af 50%, rgba(30, 64, 175, 0.8) 100%);
  border-radius: 12px 0px 0px 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
  padding: 10px 20px;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  -webkit-animation: slideInTopRight 0.3s ease-out;
  animation: slideInTopRight 0.3s ease-out;
  position: relative;
  overflow: hidden;
  min-height: 60px;
}

.toast-notification.success {
  background: linear-gradient(to right, #059669 0%, #10b981 50%, rgba(16, 185, 129, 0.8) 100%);
}

.toast-notification.error {
  background: linear-gradient(to right, #dc2626 0%, #ef4444 50%, rgba(239, 68, 68, 0.8) 100%);
}

.toast-notification.warning {
  background: linear-gradient(to right, #d97706 0%, #f59e0b 50%, rgba(245, 158, 11, 0.8) 100%);
}

.toast-notification.info {
  background: linear-gradient(to right, #1e3a8a 0%, #1e40af 50%, rgba(30, 64, 175, 0.8) 100%);
}

.toast-notification.closing {
  -webkit-animation: slideOutTopRight 0.3s ease-in forwards;
  animation: slideOutTopRight 0.3s ease-in forwards;
}

@-webkit-keyframes slideInTopRight {
  from {
    -webkit-transform: translateX(100%) translateY(-20px);
    transform: translateX(100%) translateY(-20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
}

@keyframes slideInTopRight {
  from {
    -webkit-transform: translateX(100%) translateY(-20px);
    transform: translateX(100%) translateY(-20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
}

@-webkit-keyframes slideOutTopRight {
  from {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
  to {
    -webkit-transform: translateX(100%) translateY(-20px);
    transform: translateX(100%) translateY(-20px);
    opacity: 0;
  }
}

@keyframes slideOutTopRight {
  from {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
  to {
    -webkit-transform: translateX(100%) translateY(-20px);
    transform: translateX(100%) translateY(-20px);
    opacity: 0;
  }
}

.toast-icon {
  font-size: 24px;
  margin-right: 12px;
  flex-shrink: 0;
  color: rgba(255, 255, 255, 0.9);
  display: flex;
  align-items: center;
  justify-content: center;
}

.toast-icon-img {
  width: 40px;
  height: 40px;
  display: block;
  object-fit: contain;
}

.toast-notification.success .toast-icon {
  color: rgba(255, 255, 255, 0.9);
}

.toast-notification.error .toast-icon {
  color: rgba(255, 255, 255, 0.9);
}

.toast-notification.warning .toast-icon {
  color: rgba(255, 255, 255, 0.9);
}

.toast-notification.info .toast-icon {
  color: rgba(255, 255, 255, 0.9);
}

.toast-content {
  flex: 1;
  min-width: 0;
  cursor: pointer;
}

.toast-message {
  font-size: 14px;
  line-height: 1.5;
  color: #ffffff;
  margin: 0;
  word-wrap: break-word;
  font-weight: 500;
}

.toast-subtext {
  font-size: 13px;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.85);
  margin: 2px 0 0;
  word-wrap: break-word;
  font-weight: 400;
}

.toast-close {
  background: none;
  border: none;
  font-size: 20px;
  color: rgba(255, 255, 255, 0.7);
  cursor: pointer;
  padding: 0;
  /* margin-left: 12px; */
  flex-shrink: 0;
  line-height: 1;
  -webkit-transition: color 0.2s;
  transition: color 0.2s;
  position: absolute;
  top: 5px;
  left: 5px;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.toast-close:hover {
  color: rgba(255, 255, 255, 1);
}

.toast-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  background: rgba(255, 255, 255, 0.1);
  width: 100%;
}

.toast-progress-bar {
  height: 100%;
  background: rgba(255, 255, 255, 0.3);
  width: 100%;
  -webkit-animation: progressBar linear forwards;
  animation: progressBar linear forwards;
}

@-webkit-keyframes progressBar {
  from {
    width: 100%;
  }
  to {
    width: 0%;
  }
}

@keyframes progressBar {
  from {
    width: 100%;
  }
  to {
    width: 0%;
  }
}

@media (max-width: 768px) {
  .toast-container {
    left: 10px;
    right: 0px;
    max-width: none;
    top: 450px;
  }
}

.banner h1{
    font-family: 'Russo One', sans-serif;
    color:#fff;
    font-size: 50px;
    line-height: 65px;
}

.banner-bottom {
   margin-top: 70px;
}
.bottom-left a{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #fff;
    font-weight: 600;
}
.bottom-left a:hover{
    text-decoration: none;
    color: rgb(153, 152, 152);
}
.bottom-right{
    float: right;
}
.bottom-right a{
    font-size: 16px;
    color: #fff;
    padding-left: 15px;
}
.bottom-right a:hover{
    color: rgb(153, 152, 152);
}
.appr-align{display:flex;}

.application{
    background: url(../img/app-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    margin: 50px 90px;
    overflow: hidden;
}
.mobile-section {
    text-align: center;
}
.mobile-section img{
    width:400px;
    height: auto;
}
.app-details{
    margin-top: 150px;
}
.service-track{
    background: #fff;
    padding: 15px;
    border-radius: 10px;
}
.app-details h2{
    font-family: 'Russo One', sans-serif;
    color: #fff;
    font-size: 41px;
    line-height: 48px;
    margin: 15px 0;
}
.app-details img{
    padding-right: 20px;
}

.about{
    margin-bottom: 50px;
}
.mission {
    width:100%;
    height: auto;
    overflow: hidden;
}
.mission img{
    width:100%;
    height: auto;
    overflow: hidden;
}
.vision {
    width:100%;
    height: auto;
    overflow: hidden;
}
.vision img{
    width:100%;
    height: auto;
    overflow: hidden;
}

.mission h3{
    font-family: 'Russo One', sans-serif;
    color: #003169;
    font-size: 35px;
    line-height: 48px;
    margin: 15px 0;
}
.mission p{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 600;
}

.vision h3{
    font-family: 'Russo One', sans-serif;
    color: #003169;
    font-size: 35px;
    line-height: 48px;
    margin: 15px 0;
}
.vision p{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 600;
    padding-right: 20px;
}
.vision-content{
    background: #F2BD0B;
    padding: 20px 0;
}
.vision-content img{
    width:75px;
    margin: 20px;
    background: #fff;
    padding: 20px;
    overflow: hidden;
    border-radius:50%;
}
.contact {
    margin: 100px 0 50px;
}

.contact  h2 {
    font-family: 'Russo One', sans-serif;
    color: #003169;
    font-size: 40px;
    margin-bottom: 50px;
    text-align: center;
}
.form-control{
    display: block;
    width: 100%;
    padding: 0.15rem 1.10rem !important;
    font-size: 1rem;
    line-height: 2.3 !important;
    color: #495057;
    background-color: #fff;
    background-image: none;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 1.75rem !important;

    font-size:14px !important;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.form-button{
    text-align: center;
    display: block;
}
.small-select.select-box{
  height: 35px;
}
.small-select.select-box select{
  height: 35px;
}
.small-select.select-box:after{
  background-position: center;
  height: 35px;
}
.select-box.overflow-visible{
  overflow: visible !important;
}
.select-box.overflow-visible .selectize-input{
	border-radius: 50px;
	height: 39px;
}
.select-box {
	width: 100%;
	height: 40px;
	background: rgb(255, 255, 255);
	border: 1px solid #D3D9DE;
	overflow: hidden;
    position: relative;
    border-radius: 20px;
}
.select-box select {
	width: 100%;
	height: 40px;
	background: transparent;
	padding-left: 20px;
	-webkit-appearance: none;
	line-height: 14px;
	font-size: 14px;
	color: rgb(161, 161, 161);
	padding-right: 35px;
	border: none;
  outline: none !important;
}
.select-box:after {
	content: '';
	background: url('../../img/select-arrow.svg') no-repeat;
  background-position: 0 -3px;
	height: 45px;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
	width: 35px;
}

.service_chat_body{
  word-wrap: break-word;
}
.service_chat_body p{
  font-weight: 500 !important;
}
.chat_message_body{
  position: relative;
}
.chat-wrp{
  cursor: pointer;
}

.service_chat_seen{
  position: absolute;
  bottom: -30px;
  right: 3px;
}
.service_chat_seen p{
  font-size: 10px !important;
  color: #1a1a1a;
  margin-bottom: 0;
  font-weight: 400 !important;
  text-align: end !important;
}
.chat-wrp.mb25{
  margin-bottom: 25px !important;
}

/* .btn.btn-info-form {
   font-family: Arial, Helvetica, sans-serif;
    border-radius: 25px;
    color:#003169;
    background: #F2BD0B;
    text-transform: uppercase;
    padding: 7px 25px;
    font-size: 13px;
    font-weight: 600;
    transition: 0.60s ease all;
}

.btn.btn-info-form:hover {
    background-color: #003169;
    border: 1px solid #fff;
    color: #F2BD0B;
    transition: 0.60s ease all;
}

.btn.btn-info-form-2 {
    font-family: Arial, Helvetica, sans-serif;
     border-radius: 25px;
     background-color: #F7F9FB;
     color:#003169;
     font-size: 13px;
     font-weight: 600;
     transition: 0.60s ease all;
    right: 0;
 }

 .btn.btn-info-form-2:hover {
     color: #333;
     background-color: #F7F9FB;
     transition: 0.60s ease all;
 }

 .btn.btn-info-form-3 {
    font-family: Arial, Helvetica, sans-serif;
     border-radius: 25px;
     color:#fff;
     background: #003169;
     text-transform: uppercase;
     padding: 7px 80px;
     font-size: 13px;
     font-weight: 600;
     transition: 0.60s ease all;
 }

 .btn.btn-info-form-3:hover {
    background-color: #F7F9FB;
     border: 1px solid #003169;
     color: #003169;
     transition: 0.60s ease all;
 }
 .btn.btn-info-form-4 {
    font-family: Arial, Helvetica, sans-serif;
     border-radius: 25px;
     color:#fff;
     background: #003169;
     text-transform: uppercase;
     padding: 7px 30px;
     font-size: 13px;
     font-weight: 600;
     margin-left: 25px;
     transition: 0.60s ease all;
 }

 .btn.btn-info-form-4:hover {
    background-color: #F7F9FB;
     border: 1px solid #003169;
     color: #003169;
     transition: 0.60s ease all;
 }
 .btn.btn-info-form-5 {
    font-family: Arial, Helvetica, sans-serif;
     border-radius: 25px;
     color:#6DA758;
     background: #fff;
     text-transform: uppercase;
     padding: 7px 55px;
     font-size: 13px;
     font-weight: 600;
     border: 1px solid #6DA758;
     margin-left: 25px;
     transition: 0.60s ease all;
 }

 .btn.btn-info-form-5:hover {
    background-color: #6DA758;
     border: 1px solid #6DA758;
     color: #fff;
     transition: 0.60s ease all;
 }

 button.btn.btn-info-form-5.active{
    background-color: #6DA758;
    border: 1px solid #6DA758;
    color: #fff;
 }

 .btn.btn-info-form-6 {
    font-family: Arial, Helvetica, sans-serif;
     border-radius: 25px;
     background-color: #fff;
     padding: 7px 30px;
     color:#bebec0;
     border: 1px solid #bebec0;
     font-size: 13px;
     font-weight: 600;
     transition: 0.60s ease all;
    right: 0;
 }

 .btn.btn-info-form-6:hover {
     color: #CC4D4D;
     background-color: #EA7C7C;
     transition: 0.60s ease all;
 }
 button.btn.btn-info-form-6.active{
    color: #CC4D4D;
    background-color: #EA7C7C;
 } */

 .btn-secondary {
    color: #a5a5a5;
    background-color: #fff;
    border-color: #fff;
    box-shadow: 0px 1px 3px -1px rgba(0, 0, 0, 0.16) !important;
  }

  .btn-secondary:hover {
    color: #fff;
    background-color: #003169;
  }
  button.btn.btn-secondary.active{
    color: #fff;
    background-color: #FABC11 !important;
    border-color:#fff !important;
}
.form-container .form-group input, .form-container .form-group textarea, .form-container .form-group select {
	background: #e9e9e9;
	height: 60px !important;
	width: 100%;
	color: #195c7b;
	font-size: 16px;
	padding-left: 20px;
	font-family: 'Russo One', sans-serif;
	border: 0;
	border-radius: 0;
}

.form-container .form-group label {
	font-size: 16px;
	font-family: 'Russo One', sans-serif;
	color: #5c8298;
	letter-spacing: 1px;
}
.form-container .form-group label.error,  label.error{
  color: red;
	font-size: 10px;
  text-align: center;
	/* margin-left: 10px; */
}
.invoice-dot-fields.tax-error {
    position: relative;
}
.invoice-dot-fields{
  display: flex;
}

.tax-error label.error {
    position: absolute;
    width: 150px;
    left: 35px;
}

/* .tax-error{
  color: red;
	font-size: 10px;
  position: absolute;
  text-align: left;
  margin-left: -141px;
} */


.form-container .form-group label sub {
	color: red;
	bottom: 5px;
	left: 1px;
	font-size: 13px;
}
.form-container .form-group textarea {
	height: 225px;
	max-height: 225px;
	min-height: 225px;
	padding: 20px;
	font-family: inherit !important;
}
.form-container .form-group{
	margin-bottom: 25px;
}
.form-container.mbless .form-group {
	margin-bottom: 20px;
}

.table thead th{
    vertical-align: bottom;
    border-bottom: 2px solid #e9ecef;
    background-color: rgb(218, 218, 218);
}
.table-bordered td {
    border: 1px solid #e4e4e4;
}


.tabs{
    background-color:#f5f5f5;
    padding-top:30px;
    padding-bottom:30px;
  }

  .tabs .tab-pane{
    margin-left:20px;
  }

  .tabs h3{
    font-size:20px;
    margin-top:10px;
    margin-bottom:60px;
  }

  .tabs p{
    font-size:14px;
  }

  .tabs a{
    font-size:15px;
    font-family:OpenSans,sans-serif;
    font-weight:700;
    color:#fff;
    padding:30px;
  }

  .tabs li{
    background-color:#333;
    margin-top:1px;
    text-align:center;
    height:110px;
    width:110px;
    padding-top:45px;
    -webkit-border-radius:3px;
    border-radius:3px;
  }

  .tabs li.active{
    background-color:#ff8b38;
  }


.checkbox-wrp {
	display: block;
	position: relative;
	float: left;
}
.checkbox-wrp input[type="checkbox"] {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	opacity: 0;
	cursor: pointer;
}
.checkbox-wrp .check {
	display: block;
	position: absolute;
	border: 2px solid #003169;
	border-radius: 25px;
	height: 25px;
	width: 25px;
	top: 0;
	left: 0;
	z-index: 5;
	transition: border .25s linear;
	-webkit-transition: border .25s linear;
	pointer-events: none;
}



.checkbox-wrp input[type="checkbox"]:checked ~ .check {
	border: 2px solid #003169;
	background-color: #003169;
}
.checkbox-wrp .check:before {
	display: block;
	position: absolute;
	content: '';
	height: 10px;
	width: 7px;
	top: 4px;
	left: 0px;
	right: 0;
	margin: auto;
	border: 2px solid #828894;
	border-width: 0px 2px 2px 0;
	transform: rotate(45deg);
	border-color: transparent;
}
.checkbox-wrp input[type="checkbox"]:checked ~ .check:before {
	opacity: 1;
	border-color: #fff;
}
.checkbox-wrp label {
  font-family: Arial, Helvetica, sans-serif;
	display: block;
	position: relative;
	font-size: 18px;
	padding: 2px 10px 0px 30px;
	color: #003169;
	z-index: 9;
	cursor: pointer;
	-webkit-transition: all 0.25s linear;
	pointer-events: none;
	font-weight: 600;
	margin: 0;
	line-height: 21px;
}
.checkbox-wrp label span{
    font-family: Arial, Helvetica, sans-serif;
    display: inline-block;
    color: #788491;
    font-size: 15px;
    font-weight: 600;
}
.checkbox-wrp input[type="checkbox"]:checked ~ label {color: #546fa4;}

.checkbox-wrp.checkbox-sm .check {
  height: 20px;
  width: 20px;
}
.checkbox-wrp.checkbox-sm .check::before {
  height: 9px;
  width: 6px;
  top: 3px;
}
.checkbox-wrp.checkbox-sm label {
  font-size: 14px;
  padding: 0px 10px 0px 25px;
  color: #333;
  font-weight: 400;
  line-height: 21px;
  font-family: 'Poppins', sans-serif;
}
.checkbox-wrp.checkbox-sm label {
  font-size: 14px;
  padding: 0px 10px 0px 25px;
  color: #333;
  font-weight: 400;
  line-height: 21px;
  font-family: 'Poppins', sans-serif;
}
.checkbox-wrp.checkbox-sm input[type="checkbox"]:checked ~ label {color: #003169;}

/* radio */

.radio-box {
  display: flex;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.radio-box span{
  font-family: Arial, Helvetica, sans-serif;
    display: inline-block;
    color: #788491;
    font-size: 17px;
    font-weight: 600;
}

/* Hide the browser's default radio button */
.radio-box input {
  position: absolute !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #fff !important;
  border-radius: 50%;
  border: 2px solid #003169 !important;
}

/* On mouse-over, add a grey background color */
.radio-box:hover input ~ .checkmark {
  background-color: #ccc !important;
}

/* When the radio button is checked, add a blue background */
.radio-box input:checked ~ .checkmark {
  background-color: #003169 !important;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.radio-box input:checked ~ .checkmark:after {
  display: block !important;
}

/* Style the indicator (dot/circle) */
.radio-box .checkmark:after {
 	top: 6px;
	left: 6px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: white;
}
/* radio */

.edit-pfl-mail{
    font-size: 14px;
    padding: 10px;
    background: #e9ecef;
    width: 250px;
    border-radius: 20px;
    margin: 0 auto;
    color: #003169;
}


.footer{
    background: #C0C8D0;
    width: 100%;
}
.footer-content{
    margin: 30px 0;
}
.footer-content h6{
    font-size:12px;
    text-transform: uppercase;
    color: #203255;
    margin-bottom: 20px;
}
.footer-content p{
    font-size: 15px;
    color: #203255;
    font-weight: 600;
}
.footer-app img{
    width:130px;
    height:auto;
    padding-right: 10px;
}

.footer-social a{
    font-size: 16px;
    color: #203255;
    padding-left: 15px;
}
.footer-social a:hover{
    color: rgb(255, 255, 255);
}
.footer-bottom  {
    margin:10px 0;
}
.footer-bottom p{
    padding-top: 20px;
    font-size: 12px;
    text-transform: uppercase;
    color: #203255;
    font-family: Arial, Helvetica, sans-serif;
}
.ic-logo {
    float: right;
}

/* login-page */

.login{
    background: #fff;
    padding: 25px 25px;
}
.login-banner{
    background: url(../../img/frontend/login-bg.jpg);
    width:100%;
    height: 600px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.login-banner h1{
    font-family: 'Russo One', sans-serif;
    color:#fff;
    font-size: 50px;
    line-height: 60px;
    text-align: center;
}
.login-section{
    width:300px;
    position: relative;
    margin: 0 auto;
    padding-top: 30px;
}
.login-section h4{
    font-family: 'Russo One', sans-serif;
    color: #003169;
    font-size: 16px;
    margin: 30px 0;
    text-align: center;
}
/* .login-section a{
    font-family: Arial, Helvetica, sans-serif;
    color: #003169;
    font-size: 14px;
    padding: 30px 0 0;
    text-align: center;
} */
.login-form-button{
    text-align: center;
}
.login-btn.btn-info-form {
   font-family: Arial, Helvetica, sans-serif;
   width: 160px;
    border-radius: 25px;
    color:#fff;
    background: #003169;
    border: 1px solid #003169;
    text-transform: uppercase;
    padding: 10px 25px;
    font-size: 13px;
    font-weight: 600;
    transition: 0.60s ease all;
    text-decoration: none;
}
.login-btn.btn-info-form:hover {
    background-color: #fff;
    border: 1px solid #003169;
    color: #003169;
    transition: 0.60s ease all;
}
.login-footer {
	background: #fff;
	padding: 4px 15px;
  /* margin: 20px 0 0; */
}
.login-footer p{
    padding: 10px 0 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
    text-transform: uppercase;
}
.login-vb-logo{
    width: 50px;
    height: auto;
    /* left: 0;
    right: 0;
    position: absolute; */
    margin: 0 auto;
}
.login-ic-logo{
    display: inline-block;
}
button.btn.btn-primary.btn-login {
    width: 200px;
    height: 45px;
    border-radius: 20px;
    margin-top: 20px;
}

a.btn.btn-link {
    color: #333;
    font-size: 14px;
    font-weight: 600;

}
a.btn.btn-link:hover{
    text-decoration: none;
    color: #0057b9;
}

/* Custom Remember Me Checkbox Styles */
.login-section .form-check {
    display: flex;
    align-items: center;
    padding-left: 0;
    margin-bottom: 0;
}

.login-section .form-check-input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.login-section .form-check-label {
    position: relative;
    padding-left: 32px;
    cursor: pointer;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #495057;
    margin-bottom: 0;
    user-select: none;
}

.login-section .form-check-label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    border: 2px solid #ced4da;
    border-radius: 4px;
    background-color: #fff;
    transition: all 0.3s ease;
}

.login-section .form-check-input:checked + .form-check-label:before {
    background-color: #003169;
    border-color: #003169;
}

.login-section .form-check-label:after {
    content: '';
    position: absolute;
    left: 7px;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
    width: 6px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.login-section .form-check-input:checked + .form-check-label:after {
    opacity: 1;
}

.login-section .form-check-input:hover + .form-check-label:before {
    border-color: #003169;
}

.tab-group a {
    font-family: Arial, Helvetica, sans-serif;
    display: inline-block;
    padding: 15px;
    border: none !important;
    margin: 5px -3px;
    background-color: #fff;
    font-size: 15px;
    font-weight: 600;
    line-height: 15px;
    color: #00316998;
    transition: 0.3s ease all;
    text-decoration: none;
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    font-family: Arial, Helvetica, sans-serif;
    color: #fff;
    background-color:#003169;
    font-size: 17px;
    font-weight: 600;
}
/* login-page-end */

/* admin-panel */
.navbar.bar-expand-md{padding: 10px 0;}
.admin-logo {
	width: 100px;
	position: relative;
	z-index: 100;
}
.admin-logo img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.res-head-icons{display: none;}
.menu-bar .nav-link {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 600;
	font-size: 13px;
	line-height: 24px;
	color: #003169;
	transition: 0.3s ease all;
	border: none;
	padding: 8px 10px 6px;
	margin: 0 6px;
}
.menu-bar .nav-link:hover,.menu-bar .nav-link:active,.menu-bar .nav-link.active{color: #F2BD0B;}
.header-links .dropdown-item{
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 24px;
  color: #003169;
  text-transform: uppercase;
}
.dropdown-menu .dropdown-item{
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 24px;
  color: #003169;
  text-transform: uppercase;
}
.dropdown-menu .dropdown-item:active {
  background-color: #f3f6f9;
  color: #003169;
}

.hdr-profile{
	width: 30px;
	height: 30px;
	display: block;
	float: right;
	margin: 0;
  padding: 0 !important;
	border-radius: 16px;
	background-image: url('../../img/frontend/dummy-profile.png');
	background-repeat: no-repeat;
	background-size: 30px;
	background-position: center;
  background-color: #F2BD0B;
  overflow: hidden;
}
.hdr-profile-none{
  background: none !important;
  background-image: none !important;
}
.hdr-profile img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.res-pro{display: none;}
.nav-item.header-links {
	padding: 0;
	padding-top: 15px;
}
.package-sub{
    background: #fff;
    padding: 20px;
    margin:0 0 30px 30px;
    border-radius: 10px;
}
.service-tab {
    background: #fff;
    padding: 15px;
    height: 53px;
    border-radius: 10px;
}
.sub-servive-bar {
	background-color: #868e96;
	display: flex;
	padding: 5px 10px;
	width: 100%;
	height: auto;
	color: #fff;
	border-radius: 3px;
}
.sub-servive-bar h4{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 17px;
    font-weight: 700;
    color: #fff;
}
.sub-servive-bar a{
    font-size: 16px;
    color: #fff;
}

.close a {
    font-size: 30px;
    padding-left: 30px;
    margin-top: 10px;
    color: #5c0000;
    display: block;
}
.inside-btn {
	color: #80B1E9 !important;
	font-size: 11px;
	float: right;
	margin: -27px 12px 0 0;
	position: relative;
	font-weight: 600;
}
.view-btn {
  color: #003169;
  margin-left: 5px;
  white-space: nowrap;
}
.view-btn:hover {
  color: #f2bd0b;
}
span.detVeh {
  white-space: nowrap;
}

/*Responsive Menu*/
.bodyPause{overflow: hidden;}
.header-menuBtn{
    float: right;
    position: relative;
    width: 25px;
    height: 21px;
    cursor: pointer;
    z-index: 1001;
    box-sizing: border-box;
    padding: 0;
    border: none;
    outline: none !important;
    background-color: transparent;
}
.header-menuBtn span{
    width: 25px;
    height: 3px;
    border-radius: 2px;
    background-color: #003169;
    display: block;
    position: absolute;
    left: 0;
    transition: 0.3s ease-out all;
}
.header-menuBtn.opened span{background-color: #000033;}
.header-menuBtn span.bar-01{top: 0;}
.header-menuBtn span.bar-02{top: 9px;}
.header-menuBtn span.bar-03{bottom: 0;}
.header-menuBtn span.bar-01{animation: .3s menuAction01-rev cubic-bezier(.77,2,.62,.6) forwards;}
.header-menuBtn span.bar-02{animation: .3s menuAction02-rev cubic-bezier(.77,2,.62,.6) forwards;}
.header-menuBtn span.bar-03{animation: .3s menuAction03-rev cubic-bezier(.77,2,.62,.6) forwards;}
.header-menuBtn.opened span.bar-01{animation: .3s menuAction01 cubic-bezier(.77,2,.62,.6) forwards; animation-direction: normal;}
.header-menuBtn.opened span.bar-02{animation: .3s menuAction02 cubic-bezier(.77,2,.62,.6) forwards; animation-direction: normal;}
.header-menuBtn.opened span.bar-03{animation: .3s menuAction03 cubic-bezier(.77,2,.62,.6) forwards; animation-direction: normal;}
@keyframes menuAction01 {
    0%{
        top: 0;
    }
    50%{
        top: 11px;
        transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
    100%{
        top: 10px;
        transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
    }
}
@keyframes menuAction03 {
    0%{
        bottom: 0;
    }
    50%{
        bottom: 11px;
        transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
    100%{
        top: 10px;
        transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
    }
}
@keyframes menuAction02 {
    0%{
        opacity: 1;
    }
    50%{
        opacity: 1;
    }
    51%{
        opacity: 0;
    }
    100%{
        opacity: 0;
    }
}

/*Reverse*/
@keyframes menuAction01-rev {
    100%{
        top: 0;
    }
    50%{
        top: 11px;
        transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
    0%{
        top: 10px;
        transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
    }
}
@keyframes menuAction03-rev {
    100%{
        bottom: 0;
    }
    50%{
        bottom: 11px;
        transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
    0%{
        top: 10px;
        transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
    }
}
@keyframes menuAction02-rev {
    100%{
        opacity: 1;
    }
    50%{
        opacity: 1;
    }
    51%{
        opacity: 0;
    }
    0%{
        opacity: 0;
    }
}
/*admin-panel- Ends*/

/* admin-inner-page */

.ribbon{
    background: #E7EDF4;
    /* position: fixed;
    left: 0;
    width: 100%;
    z-index: 99;
    transition: all ease .3s; */
}
.ribbon-content {
	padding: 10px 0;
	display: flex;
	justify-content: center;
	align-items: center;
}
.ribbon-image {
	width: 35px;
	height: 35px;
	border-radius: 60px;
	overflow: hidden;
	flex-basis: auto;
}
.ribbon-content img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.ribbon-content h4 {
	font-family: 'Russo One', sans-serif;
	color: #003169;
	font-size: 16px;
	margin-bottom: 0;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.wrapper{
  position: relative;
  padding-bottom: 30px;
  /* min-height: 700px; */
  margin-top: 129px;
}
.wrapper::before{
  background: #F7F9FB;
  position: fixed;
  content: '';
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.job-order-create{
    margin: 45px 0;
}
.job-order-create h2{
    font-family: 'Russo One', sans-serif;
    color: #003169;
    font-size: 30px;
    margin-bottom: 15px;
}

.btn {
    font-family: Arial, Helvetica, sans-serif;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    padding: 10px 25px;
    font-size: 14px;
    line-height: 1.5;
    border-radius: 15px;
    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;

}
  .prof-top-box {
    background-color: #F2BD0B;
    /* background-image: -webkit-linear-gradient(327deg, #215eae 25%, #6cb631 100%);
    background-image: -o-linear-gradient(327deg, #215eae 25%, #6cb631 100%);
    background-image: linear-gradient(57deg, #215eae 25%, #6cb631 100%); */
    padding: 20px;
    position: relative;
}
.propic {
    width: 100px;
    height: 100px;
    background: peachpuff;
    border-radius: 100px;
    -moz-border-radius: 100px;
    -webkit-border-radius: 100px;
    margin: 0px auto;
    overflow: hidden;
}
.propic .img-fluid{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.prof-box{
	border: 1px solid #e3e3e3;
	padding: 10px 0;
    margin-top: -1px;
    text-align: left;
    background: #fff;
}
.prof-box h4{
    font-family: 'Russo One', sans-serif;
    color: #003169;
    font-size: 30px;
}
.prof-box p{
	font-size: 16px;
	color: #707173;
	margin-bottom: 0;
}
.prof-box-inner *{
	font-family: 'Russo One', sans-serif;
    letter-spacing: 1px;
    color: #003169;
    font-size: 14px;
}
.fixed-btn {
    position: absolute;
    background: rgba(0, 49, 105, 0.7);
    padding: 3px 10px;
    border-radius: 15px;
    right: 0;
    bottom: 0;
    color: #fff;
    font-size: 14px;

}
.fixed-btn:hover{
    text-decoration: none;
    background: #003169;
    color: #fff;
}


.tab-group{text-align: center;}
.tab-group a {
	display: inline-block;
	padding: 15px;
	border: 1px dashed #00316983;
	margin: 5px -3px;
	background-color: #fff;
	font-size: 17px;
	line-height: 15px;
	color: #00316998;
	transition: 0.3s ease all;
	text-decoration: none;
}
.tab-group a:hover,.tab-group a:focus{background-color: #0031694f; color: #003169;}
.tab-group a.active{
	background-color: #003169;
	color: #fff;
}
.tab-group a i{margin-right: 4px;}
.carddetails-wrp .auther-details a {
	width: auto;
	padding: 8px 12px;
	margin: 0 0 5px 5px;
	font-size: 14px;
	line-height: 24px;
}
.profile-image-upload {
	position: relative;
	width: 120px;
	height: 120px;
	margin: 0px auto 30px;
  overflow: hidden;
  border-radius: 100%;
  border: 1px solid #ddd;
}
.profile-image-upload:hover .myprofile-hover{
  top: 0;
  transition: all ease 0.3s;
}
.img-profile{
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #fff;
  display: block;
}
.profile-image-upload .aupload {
	width: 30px;
	height: 30px;
	background: #fff;
  border: 1px solid #003169;
	text-align: center;
	border-radius: 100px;
  transition: all ease .3s;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  margin: 0 3px;
}
.myprofile-hover .img-remove {
  color: #CC4D4D !important;
  font-size: 12px;
  width: 30px;
  height: 30px;
  border: 1px solid #CC4D4D;
  text-align: center;
  line-height: 30px;
  background: #fff;
  border-radius: 50%;
  display: inline-block;
  margin: 0 3px;
}
.myprofile-hover{
	position: absolute;
	left: 0;
	top: -110%;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.8);
	justify-content: center;
	align-items: center;
  display: flex;
  border-radius: 100%;
  transition: all ease 0.3s;
  padding: 20px;
}
.client-heading{
    margin-top: 50px;
}
.client-heading h5{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    color: #909CAA;
    text-transform: uppercase;
    font-weight: 600;
}
.client-heading h5 span{
    float: right;
    font-weight: 600;
}
.client-details{
    background: #FFF;
    padding: 10px 0 0;
    margin-bottom: 20px;
}
.client-details a{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #003169;
    /* text-transform: capitalize; */
    font-weight: 600;
}
.client-details a:hover{
    color: #1E84EA;
    text-decoration: none;
}
.client-details a span{
    float: right;
}
.client-details img {
    width: 30px;
    height: 30px;
    display: inline;
    margin: 0;
    border-radius: 16px;
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: center;
}
.client-details p{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #74808E;
    padding-top:10px;
}
.client-details span{
    color:#EB6D6D;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: 600;
    padding:0;
}
.job-order-details{
    background: #FFF;
    padding: 10px 0 0;
    margin-bottom: 20px;
}
.job-order-details a{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #003169;
    text-transform: capitalize;
    font-weight: 600;
}
.job-order-details a:hover{
    color: #1E84EA;
    text-decoration: none;
}
.job-order-details a span{
    float: right;
}
.job-order-details img{
    width: 30px;
    height: 30px;
    display: inline;
    margin: 0;
    border-radius: 16px;
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: center;
}

.job-order-details p{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #74808E;
    padding-top:10px;
    display: inline;
}
.job-order-details span{
    color:#EB6D6D;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: 600;
    padding:0;
}
.detail-section {

    border-bottom: 1px solid #BFD0E2;
    padding: 10px 0;
}

.detail-sub {
    margin-left: 10px;
    padding: 10px 0 10px 20px;
    border-left: 1px solid #BFD0E2;
    position: relative;
}
.detail-sub:before{
    content: '';
}

.detail-section-2 {
    border-bottom: 1px solid #BFD0E2;
    margin-bottom: 10px;
    padding-bottom: 10px;
}

.detail-sub:before {
    content: '';
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #bebec0;
    position: absolute;
    left: -5px;
    top: 0;
    bottom: 0;
    margin: auto 0;
}
.detail-sub:after{
    background-color: #CC4D4D;
}

.detail-sub.completed:before{
    background-color: #6DA758;
}
.detail-sub.delayed:before{
    background-color: #CC4D4D;
}

.tab-content{
    background: #fff;
    padding: 20px 0;
}
.tab-heading {
    border-bottom: 1px solid #BFD0E2;
    display: flow-root;
}

.tab-heading p{
    font-family: Arial, Helvetica, sans-serif;
    display: inline;
    color: #003169;
    font-size: 15px;
    font-weight: 600;
}
.tab-heading p span{
    font-family: Arial, Helvetica, sans-serif;
    display: inline;
    color: #788491;
    font-size: 11px;
    font-weight: 600;
}
.tab-details {
    padding:25px 0;
}

.tab-details p{
    font-family: Arial, Helvetica, sans-serif;
    display: inline;
    color: #003169;
    font-size: 15px;
    font-weight: 600;
}

.tab-details p span{
    font-family: Arial, Helvetica, sans-serif;
    display: inline;
    color: #788491;
    font-weight: 600;

}

.switch {
    position: relative;
    display: inline-block;
    width: 43px;
    height: 25px;
  }

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

  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    border: 2px solid #788491;
    -webkit-transition: .4s;
    transition: .4s;
  }

  .slider:before {
    position: absolute;
    content: "";
    height: 15px;
    width: 15px;
    left: 2px;
    bottom: 3px;
    background-color: #788491;
    -webkit-transition: .4s;
    transition: .4s;
  }

  input:checked + .slider {
  	background-color: #e8fce7;
  	border: 2px solid #c0dbc3;
  }
  input:checked + .slider:before{
    background-color: #39d057;
  }
  input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
  }

  input:checked + .slider:before {
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }

  .slider.round {
    border-radius: 34px;
  }

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

/* admin-inner-page-end */

.page-title{
	font-family: 'Russo One', sans-serif;
	color: #003169;
	font-size: 30px;
}
.btn-light {
	height: 40px;
	border-radius: 50px;
	background: #fff;
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.16);
	font-weight: bold;
	font-size: 14px;
	text-align: center;
	color: #6683A5;
	line-height: 16px;
  padding: 10px 25px;
}

.btn-tab {
	height: 40px;
	/* border-radius: 50px; */
	background: #fff;
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.16);
	font-weight: bold;
	font-size: 14px;
	text-align: center;
	color: #6683A5;
	line-height: 16px;
  padding: 10px 25px;
}
.btn-group-vertical{
  width: 100%;
  /* margin-top: 50px; */
  border: 1px solid #dae0e5;
  background: #fff;
}
.btn.btn-light.btn-tab {
    width: 100%;
    border-radius: 0;
    text-align: left;
    padding: 30px 0 30px 20px;
    line-height: 0;
    border-top: 1px solid #dae0e5;
}
.btn-group-sm .btn-light{
  height: auto;
}
.border-secondary{
  border-color: #D3D7DB !important;
}
.btn-primary{
  /* width: 276px; */
  height: 38px;
  border-radius: 25px;
  background: #003169;
  font-family: "Russo One";
  font-weight: normal;
  font-size: 13px;
  text-align: center;
  color: #f7f9fb;
  line-height: 18px;
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.16);
}
.btn-primary:hover {
  color:#F2BD0B;
  background-color: #fff;
  border-color: #FFF;
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.16);
}
/* a.btn.btn-primary.active{
  color: #003169;
  background-color: #FABC0E;
  border-color: #003169;
} */

.btn-secondary{
  height: 40px;
  background: #fff;
  border-color: #fff;
  font-family: "Russo One";
  font-weight: normal;
  font-size: 14px;
  text-align: center;
  color: #B2C1D2;
  line-height: 18px;
}
.btn-secondary.active, .btn-secondary:hover{
  background: #FABC11;
  border-color: #FABC11;
  color: #fff;
}
.btn-link{
  font-weight: bold;
  font-size: 13px;
  color: #7c7c7c;
  line-height: 18px;
}
.btn-link:hover{
  text-decoration: none;
  opacity: .6;
}
.logo-wraper {
	width: 220px;
	margin: 0 auto;
}
.dropdown-menu-right {
right: 0;
left: auto;
}

.header-wrp .navbar.navbar-expand-xl{
  justify-content: space-between !important;
}

.btn-secondary:not([disabled]):not(.disabled):active, .btn-secondary:not([disabled]):not(.disabled).active, .show > .btn-secondary.dropdown-toggle{
  box-shadow: none;
  background-color: #FABC11;
  border-color: #FABC11;
}
.btn-primary:not([disabled]):not(.disabled).active {
  color: #003169 ;
  background-color: #FABC0E;
  box-shadow: none;
  border: none ;
}

.btn-primary:not([disabled]):not(.disabled):active .show> .btn-primary.dropdown-toggle{
  box-shadow: none;
  background-color: #fff;
  border-color: #fff;
  color: #003169;
}
.btn{
  border-radius: 50px;
}
.btn-options {
	width: 26px;
	height: 26px;
	border-radius: 50px;
	background: #fff;
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.16);
	font-weight: bold;
	font-size: 14px;
	color: #6683A5 !important;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 4px;
}
.btn-options:hover{
	color: #111;
	background-color: #e2e6ea;
	border-color: #dae0e5;
}
.btn-group{
  box-shadow: 0px 1px 3px -1px rgba(0, 0, 0, 0.16);
  border-radius: 50px;
}
.badge-danger {
  /* background-color: #ffbac1 !important; */
  padding: 6px 12px;
  border-radius: 50px !important;
}
.badge.badge-danger:hover {
    background: #f07883!important;
}
.badge.badge-dark:hover {
    background: #6a7279!important;
}
.badge-success {
  background-color: #28a745;
  padding: 6px 12px;
  border-radius: 50px;
}

.badge.badge-danger.approvedelay {
	background: #c2c2c2;
}
.badge-warning-active {
    color: #fff !important;
    background-color: #003169 !important;
}
.swzcmntcls {
    background: #e4edf7;
}
.main-item-name{
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	color: #003169;
  font-size: 14px;
  overflow: hidden;
}

.main-item-name2{
	font-family: 'Poppins', sans-serif;
	color: #003169;
  font-size: 14px;
}
/* .vinclickcls.viname {
    font-size: 13px;
    text-align: center;
    width: 125px;
    display: inline-block;
    line-height: 16px;
    margin-top: 5px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
} */
.vinclickcls{
  font-weight: 600;
  color: #003169 !important;
  cursor: pointer;
}
.vinclickcls:hover{
  color: #0056b3;
}
span.btn-green, span.btn-yellow, span.btn-red,span.btn-pink,span.btn-blue{
  width: 15px;
  height: 15px;
  border-radius: 50%;
  display: block;
}
span.btn-green{background-color: #55D345;}
span.btn-yellow {background-color: #FABC11;}
span.btn-red {background-color: #E74C3C;}
span.btn-blue {background-color: #0909d3;}
span.btn-pink {background-color: #ff7a2a;}


.card-body{
  padding: .5em 1.25em;
}
.card{
  border-radius: 3px;
  background: #fff;
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.16);
  border: none;
}
.cardhov:hover{
  box-shadow: 0px 0px 24px rgba(17, 169, 250, 0.15);
}

.paid a{
  border-radius: 20px;
  border: 1px solid #269838;
  color:#269838;
  font-size: 11px;
  padding: 4px 8px;
}
.paid a:hover{
  background-color: #269838;
  color:#fff;
}
footer {
	/* position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	z-index: 99; */
	box-shadow: 0 0px 3px rgba(0,0,0,0.13);
}
.page-subtitle {
	font-family: 'Russo One', sans-serif;
	color: #003169;
	font-size: 18px;
}
/* .btn-chev-right{
	width: 20px;
	text-align: right;
	cursor: pointer;
	font-size: 21px;
	color: #B2C1D2;
} */
.btn-chev-right{
  display: block;
  float: left;
  cursor: pointer;
  width: 100%;
}
.btn-chev-right i{
  float: right;
  line-height: 22px;
}
.btn-chev-right label {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	color: #788491;
	z-index: 9;
	font-weight: 600;
	margin: 0;
	line-height: 21px;
  cursor: inherit;
  word-wrap: break-word;
  padding-right: 10px;
}
.btn-chev-right:hover label{
  color: #003169;
}
.btn-chev-right:hover i{
  color: #F2BD0B;
}
.package-list.list-group .list-group-item{
  border: none;
  border-top: 1px solid #F7F9FB;
  padding: 0.75rem 0;
}
.package-list.list-group .list-group-item:first-child{
  border-top: 0;
}
.brdr-rad15{border-radius: 15px;}
/* textarea{resize:none;} */
textarea.form-control{
  border-radius: .75rem !important;
  resize: vertical;
  line-height: 20px !important;
  padding-right: 100px !important;
  min-height: 70px;
}
textarea.form-control.offlinemsg{
  height: 200px;
}
.spot-img{
  width: 25px;
  height: 25px;
  overflow: hidden;
  border-radius: 50px;
  display: flex;
  flex-grow: 0;
  flex-shrink: 0;
}

.resp-img{
	width: 100%;
	height: 100%;
	object-fit: cover;
  vertical-align: top;
}
.dot::after {
	width: 9px;
	height: 9px;
	content: '';
	position: absolute;
	left: 18px;
	top: 50%;
	background: #BFD0E2;
	border-radius: 50px;
	transform: translateY(-50%);
}
.dot::before {
	width: 1px;
	height: 100%;
	content: '';
	background: #BFD0E2;
	position: absolute;
	left: 22px;
	top: 0;
}
.dot:last-child::before{
  height: 50%;
}

.small-row .form-control{
	padding: 0.375rem 0.6rem !important;
	font-size: 1rem;
	line-height: 1 !important;
	border-radius: 1rem !important;
}
.tooltip{font-size: 14px !important;}

.page-link {
	position: relative;
	display: block;
	padding: 0.5rem 0.75rem;
	margin-left: -1px;
	line-height: 1.25;
	color: #B2C1D2;
	background-color: #fff;
	border: 1px solid #ddd;
	font-weight: 600;
	font-size: 14px;
	box-shadow: 0 1px 3px -2px rgba(0,0,0,0.4);
}
.page-link.active{
  color: #003169;
	background-color:#FABC11;
}
.page-item.active .page-link {
    background-color: #003169;
    border-color: #003169;
}
/*Accordion*/
.opened-box, .toggle-enable{
	padding: 0;
	margin-bottom: 0px;
	position: relative;
  border-bottom: 1px solid #dfdfdf;
}
.card-body .opened-box:last-child,
.card-body .toggle-enable:last-child{
  border-bottom: none;
}
.opened-box:last-child{border-bottom: 0}
.opened-box .opened-boxhead-box h3{
	font-family: Arial, Helvetica, sans-serif;
	display: block;
	position: relative;
	font-size: 18px;
	color: #003169;
	z-index: 9;
	cursor: pointer;
	-webkit-transition: all 0.25s linear;
	pointer-events: none;
	font-weight: 600;
	margin: 0;
	line-height: 21px;
}
.opened-box .opened-boxhead-box {
	display: block;
  cursor: pointer;
}
.accordion-trigger {
	padding: 15px 10px;
	width: 40px;
	color: #788491;
	font-size: 13px;
  text-align: center;
}
.opened-box.active > .opened-boxhead-box > div > .accordion-trigger > i {transform: rotate(90deg);}
.service-count {
	font-size: 13px;
	margin-right: 20px;
	color: #fff;
	/* border: 1px solid #dfdfdf; */
	padding: 5px 10px 3px 10px;
	border-radius: 50px;
	background: #f9be42;
	font-weight: 600;
  width: 42px;
  text-align: center;
  display: flex;
  flex: 1 1 auto;
}
.opened-box .opened-details {
	border: 1px dashed #dedede;
  border-radius: 3px;
	display: none;
}
.opened-box p {
	font-size: 16px;
	line-height: 24px;
	color: #575758;
}
.opened-box:last-child {
	border-bottom: 0;
}
/*Accordion*/
.job-detail-head{
	font-size: 18px;
	font-weight: 600;
	color: #003169;
}
.spot-img.pic20{
  width: 20px;
  height: 20px;
}
.btn-outline-danger, .btn.btn-outline-danger{
	color: #dc3545;
	background-color: #fff;
	border-color: #dc3545;
}
.btn-outline-success, .btn.btn-outline-success{
	color: #28a745;
	background-color: #fff;
	border-color: #28a745;
}
.btn.btn-outline-danger:hover {
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545;
}
.btn.btn-outline-success:hover {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}
.btn-outline-info, .btn.btn-outline-info{
  color: #17a2b8;
  background-color: #fff;
  border-color: #17a2b8;
}
.btn.btn-outline-info:hover {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}

.custom-multiselect .ms-parent{
  width: 100% !important;
}
.custom-multiselect .ms-choice {
	display: block;
	width: 100%;
	min-height: 39px;
	padding: 0.15rem 1.10rem !important;
	overflow: hidden;
	cursor: pointer;
	border: 1px solid #ced4da;
	text-align: left;
	white-space: nowrap;
	line-height: 2.3 !important;
	color: #444;
	text-decoration: none;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 1.75rem !important;
	background-color: #fff;
}
.custom-multiselect .ms-choice > span {
	position: absolute;
	top: 0;
	left: 0;
	right: 20px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: block;
	padding: 5px 15px;
	font-size: 14px;
	line-height: 2.5;
}
.subsortable.ui-sortable-helper,
.mainsortable.ui-sortable-helper{
  box-shadow: 0 0 20px -10px rgba(0,0,0,0.3);
  background: #fff;
}
.mainsortable .opened-details{
  padding: 10px;
}
.list-group-item.subsortable{
  padding: 10px 18px;
}
.opened-box.mainsortable.active, .opened-box.active{
  border-bottom: 0;
}
.btn-outline-info{
	color: #17a2b8;
	background-color: #fff;
	border-color: #17a2b8;
}
.report-table .table thead th {
	background-color: #f8f9fa;
	font-size: 11px;
	font-weight: 500;
	color: #868e96;
}
.report-table .table th, .report-table .table td {
	font-size: 11px;
	color: #003169;
}
.btn-options.dropdown-toggle::after{
  display: none;
}
.cog-group .dropdown-item{
  color: #6683A5;
  font-size: 13px;
  padding: 0.25rem 0.65rem;
  text-align: left;
}
.cog-group .dropdown-menu{
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.16);
  border-color: #dfdfdf;
  width: 205px;
}
.ui-menu .ui-menu-item-wrapper {
	padding: 10px 15px !important;
	display: block;
	font-size: 14px;
}
.ui-menu .ui-menu-item{
  height: auto !important;
}
.srchuser-downname.ui-menu-item-wrapper.ui-state-active{
  background: #F2BD0B;
  border-color:#F2BD0B;
}
.dropdown-menu{
  min-width: 11.3rem;
  border: none;
  box-shadow: 0px 0px 5px 0px #e6e6e6;
}
.notification.spot{
  cursor: pointer;
}
.notification.spot::before,
.apprl-alert::before {
  width: 8px;
  height: 8px;
  content: '';
  border-radius: 50px;
  background: #e74c3c;
  position: absolute;
  right: -1px;
  top: 1px;
}

.nav-item.dropdown .apprl-alert::before {
  right: 19px;
  top: 7px;
}

.nav-link.apprl-alert::before {
  top: 7px;
  right: 6px;
}

.notification .dropdown-menu{
  max-width: 280px;
  width: 280px;
  background-color: transparent;
  border: none;
  overflow: hidden;
  max-height: 225px;
  overflow-y: scroll;

}
.notification .dropdown-menu ul.list-group{
  padding: 0;
}
.notification .dropdown-menu ul .notifycls {
  border: none;
  /* margin-bottom: 5px; */
  border-radius: 3px;
  box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.16);
  padding: 15px;
}
.notification .dropdown-menu ul.list-group li a{
	display: block;
	line-height: 17px;
}
.notification .dropdown-menu ul.list-group li:hover{
	background: #f8f9fa;
}
.notification .dropdown-menu ul.list-group li:hover a span{
  color: #003169 !important;
}
.notification .dropdown-menu ul.list-group li a span{
	font-size: 12px;
	white-space: normal;
	line-height: 17px;
	color: #40474d;
}
.bootstrap-datetimepicker-widget table td.today::before{
  display: none !important;
}
.bootstrap-datetimepicker-widget table td.day.active{
  border-radius: .25rem !important;
}
.notification ul.list-group li a span.notif-time {
  display: block;
  text-align: right;
  font-weight: 600;
  color: #999;
  font-size: 11px;
}
.notification ul.list-group li a span.user-img {
  margin-top: 5px;
  font-weight: 600;
  color: #999;
  font-size: 11px;
  display: block;
}
.notification ul.list-group li a span.user-img img{
  width: 20px;
  height: 20px;
  border-radius: 20px;
  object-fit: cover;
  margin-right: 5px;
  display: inline-block;
}
.notification-date{
  display: block;
  color: #003169;
  font-size: 11px !important;
  font-weight: 600;
  margin-top: 3px;
}
.readed {
    background: #f7f7f7;
    color: #bfbfbf !important;
}
.readed span{
  color: #bfbfbf !important;
}
.readed .notification-date{
  color: #bfbfbf !important;
}
.joborder-wrp {margin: 10px auto;}
.joborder-wrp, .joborder-imgs {position: relative; text-align: center;}
.joborder-imgs {width: 100px; height: 100px; margin: 0 auto .5em;}
.joborder-imgs img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.joborder-imgs .jo-action {
  font-size: 26px;
  position: absolute;
  right: 0;
  display: block;
  bottom: 13px;
  z-index: 9999999999;
  background-color: #fff;
  border-radius: 50%;
  width: 26px;
  height: 26px;
  line-height: 26px;
}
.joborder-wrp p{
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  color: #003169;
  font-size: 14px;
  margin: 0;
}
.fa.fa-clock-o::before{
  content: "\f017";
}

.inquiry-details {
  border: 1px solid #dadada;

}
.inquiry-heading{
  border-bottom:  1px solid #dadada;
  padding: 20px;
}
.inquiry-heading h6{
  color: #003169;
  text-transform: uppercase;
  font-size: 14px;
}
.inquiry-heading h3{
  color: #003169;
  text-transform: uppercase;
  font-size: 20px;
  font-weight: 500;
}
.inquiry-heading h2{
  color: #003169;
  font-size: 20px;
  margin-bottom: 15px;
  font-weight: 600;
}
.inquiry-heading p{
  color: #6d6d6d;
  font-size: 14px;
  line-height: 21px;
}
.inquiry-heading p.date{
  color: #707070;
  font-size: 14px;
  line-height: 15px;
  padding-top: 10px;
  float: right;
}
.inquiry-top-bar {
  padding: 5px 10px 0 10px;
  background: #e9ecef;
  margin-bottom: 20px;
}
.inquiry-comment{
  padding: 20px;
  border-bottom:  1px solid #dadada;
}
.inquiry-comment h6{
  color: #003169;
  font-size: 16px;
  margin-bottom: 20px;
  font-weight: 600;
}
.inquiry-comment-list{
  padding: 20px;
  border-bottom:  1px solid #dadada;
}

.inquiry-comment-list h6{
  color: #003169;
  text-transform: uppercase;
  font-size: 14px;
  margin: 0 0 0 5px;
}
.inquiry-comment-list p{
  color: #191919;
  font-size: 14px;
  line-height: 21px;
}
.inquiry-comment-list p.date{
  color: #707070;
  font-size: 14px;
  line-height: 21px;
}

.inquiry-file{
  width: 100px;
	display: inline-block;
	margin: 0 15px 15px 0;
	overflow: hidden;
}

.uploaded-resume {
    background: #fff;
    padding: 10px;
    border-radius: 20px;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.16);
}
a.icon-btn.orange-btn {
    color: #c70013;
    padding-right: 10px;
}

.uploaded-resume span {
    font-size: 15px;
    color: #003169;
    padding-left: 10px;
}

span.filename {
  font-size: 13px;
  text-align: center;
  width: 100px;
  display: inline-block;
  line-height: 16px;
  margin-top: 5px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.file-view{
  width: 60px;
  height: 60px;
  background-color: #e7edf4;
  position: relative;
  display: block;
  overflow: hidden;
}
.file-view img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.file-overlay{
  width: 60px;
  height: 60px;
  position: absolute;
  background-color: rgba(0, 49, 105, 0.7);
  color:#fff;
  top:100%;
  bottom:0;
  overflow: hidden;
}
.file-view:hover .file-overlay{
	top:0%;
}
.file-icon {
  width: 50px;
  height: 30px;
  position: absolute;
  text-align: center;
  top: 25px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: 0 auto;
}
.file-icon a{
  color:#fff;
  font-size: 17px;
  padding: 5px;
}
.paySel span {
  padding-left: 40px;
}
.paySel img {
  position: absolute;
  top: 5px;
  left: 20px;
  height: 13px;
}
.paySel input {
  float: right;
  position: relative;
  top: 3px;
  right: 3px;
}
.selectOpt i {
  color: #003169;
  font-size: 12px;
}
.selectOpt p {
  display: inline;
  padding-right: 10px;
  margin: 0;
}
.selectOpt {
  background: #f1f8ff;
  padding: 3px 14px;
  border-radius: 20px;
  display: inline-block;
  border: 1px solid #ced4da;
  margin-left: 10px;
  margin-bottom: 10px;
  font-size: 12px;
}
a.removeImg {
  position: absolute;
  right: 6px;
  top: 6px;
}
a.removeImg i{
  color: #003169;
}

/* dashboard */
.success-rate{
  width: 100%;
  height: 100%;
  background-color: #fff;
  padding: 20px;
  box-shadow: 0 1px 3px -1px rgba(0,0,0,0.3),0 1px 19px -2px rgba(0,0,230,0.1);
  -moz-box-shadow: 0 1px 3px -1px rgba(0,0,0,0.3),0 1px 19px -2px rgba(0,0,230,0.1);
}

.success-rate h6{
  color: #003169;
  font-size: 14px;
  font-weight: 600;
}

.nav-tabs .nav-link.active{
    color: #003169;
    font-weight: 600;
    font-size: 13px;
    background-color: #fff;
    border-color: #fff;
    border-bottom: 2px solid #003169 !important;
}
.nav-tabs .nav-link{
  font-size: 13px;
  color: #909CAA;
  font-weight: 600;
}
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
  border-color: #fff #fff #003169;
  border-bottom: 2px solid #003169;
  color:#003169;
}
.navbar-expand-xl .navbar-nav .nav-link {
    padding-right: .4rem;
    padding-left: .4rem;
}
.job-details{
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  flex-grow: 1;
}
.job-details-status {
  background-color: #FFF;
  width: 55px;
  height: 55px;
  border-radius: 50%;
  position: relative;
  border: 1px solid #e6e6e6;
  justify-content: center;
  align-items: center;
  display: flex;
}
.job-details-status span{
  position: absolute;
  color:#FABC11;
  font-size: 30px;
  display: flex;
  /* top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center; */
}
.job-details-status span.completed{
  color: #55D345;
}
.job-details-status span.inprogress{
  color: #45AAD3;
}
.job-details-txt{
  text-align: center;
}
.job-details-txt h5{
  color: #003169;
  font-size: 15px;

}
.job-details-txt h2{
  color:#003169;
  font-weight: 600;
  font-size: 35px;
}
.job-orders-status h6{
  color:#003169;
  font-size: 18px;
  text-align: center;
  margin-top: 20px;
}
.job-orders-txt h2{
  color:#003169;
  font-size: 20px;
  text-align: center;
}
h4.job-detail-head.pkg {
    color: #0053b3;
}
p.text-yelow {
  font-size: 14px;
  color: #B18B24;
}
.onoffline{
  font-weight: 600;
}

.online-details{
  display:inline-flex;
}
.online-details h4{
  font-size: 18px;
  color: rgba(0, 49, 105, 0.3);
  padding-right: 10px;
  font-weight: 600;
  text-transform: uppercase;
}

.online-details h4 span{
  font-size: 18px;
  color: rgb(0, 49, 105);
  padding-left: 10px;
  font-weight: 600;
    text-transform: uppercase;
}
.chat-section{
  width: 100%;
  min-height: 350px;
  /* height: auto; */
  background-color: #fff;
  border-bottom: 1px solid #E5E5E5;
  display: flex;
  position: relative;
}
.chat-search{
  position: absolute;
  top: 0;
  left: 0;
  width: 40%;
  max-width: 390px;
  z-index: 9;
}
.chat-search input{
  border-radius: 0 !important;
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.13);
}
.chat-box {
	/* height: 800px; */
	position: relative;
	width: 60%;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}
.chat-peoples{
  border:1px solid #E5E5E5;
  border-bottom-color: #fff;
  /* height: 800px; */
  overflow: hidden;
  overflow-y: scroll;
  width: 40%;
  max-width: 390px;
  display: flex;
  margin-top: 38px;
  z-index: 9;
}

.chat-list{
  border-bottom:1px solid #E5E5E5;
}
a.jobchatlist{
  padding: 15px;
  display: block;
}
a.jobchatlist.active {
  background-color: #ffeec4;
  display: block;
  border-left: 5px solid #F2BD0B;
  transition: all ease .3s;
}
a.pdf-chat {
    font-size: 40px;
    color: #004ca2;
    position: relative;
    display: block;
    background: rgba(255, 255, 255, 0.5);
    padding: 0 12px;
    margin-bottom: 8px;
    border-radius: 5px;
}
a.pdf-chat:hover{
  opacity: .5;
}
/* a.pdf-chat:hover::after {
  opacity: 1;
} */
a.pdf-chat::after {
	font-family: "Font Awesome 5 Pro";
	content: "\f358";
	width: 100%;
	height: 100%;
	font-size: 20px;
	position: absolute;
	z-index: 99;
	color: #004ca2;
	transition: 0.3s ease all;
	right: 0;
	top: 0;
	bottom: 0;
	margin: 0 auto;
	text-align: right;
	line-height: 60px;
	padding-right: 12px;
}
a.pdf-chat::before {
	content: 'Download';
	width: 100%;
	height: 100%;
	position: absolute;
	right: 0;
	font-size: 13px;
	top: 0;
	text-align: right;
	padding-right: 40px;
	line-height: 60px;
}
.modal-body.chat-img-view img {
    max-width: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    max-height: 500px;
    overflow: inherit;
    object-position: center;
    margin: 0 auto;
}
.chat-peoples h6 {
  font-size: 10px;
  color: #003169;
}
.chat-peoples h6 span {
  font-size: 10px;
  color: #707070;
}
.chat-peoples h4 {
  font-size: 15px;
  font-weight: 600;
  color: #003169;
  margin-bottom: 0;
}
.chat-peoples h4 span {
  font-size: 10px;
  color: #707070;
}
.chat-nmbr {
  width: 20px;
  height: 20px;
  background-color: #E74C3C;
  border-radius: 50%;
  position: relative;
}
.chat-nmbr p {
  color: #fff;
  font-size: 10px;
  text-align: center;
  top: 2px;
  bottom: 0;
  margin: 0 auto;
  position: absolute;
  left: 0;
  right: 0;
}
/* .chat-box{
  width:100%;
  height: 500px;
} */

.btn-chat-attachment {
	width: 25px;
	height: 25px;
	overflow: hidden;
	color: #999;
	border-radius: 50%;
	text-align: center;
	line-height: 25px;
	font-size: 20px;
	transition: 0.3s ease all;
	cursor: pointer;
}
.message-create .btn-chat-attachment{
	position: absolute;
	bottom: 18px;
	right: 10px;
	top: auto;
	margin: 0;
}
input#fileupload {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    cursor: pointer;
}

.message-create{
  position: relative;
  width:calc(100% - 65px);
}

.chat-header{
  border-bottom:1px solid #E5E5E5;
  padding:10px 15px;
  background-color: #fff;
}
.btn-small-chat {
	padding: 0 15px !important;
	font-size: 13px !important;
	line-height: 24px !important;
	height: 30px !important;
	width: auto !important;
  display: flex;
  align-items: center;
}
span.chat-close{
  font-size: 20px;
  color: #1F4A7B;
  padding: 5px 5px 5px 0;
  display: none;
}
.chat-header p{
  color: #003169 !important;
	font-size: 15px;
	font-weight: 600;
}
.chat-date{
  width: 100px;
  margin: 0 auto;
  margin-top: 20px;
  margin-bottom: 20px;
}
.chat-date p{
  color: #707070;
  background-color: #D9D9D9;
  padding: 6px 10px;
  text-align: center;
  font-size: 14px;
  border-radius: 30px;
}
.chat{
  width:100%;
  /* height: 340px; */
  background-color: #EDEDED;
  overflow: hidden;
  display: flex;
  flex-grow: 1;
  position: relative;
}
.chat-view-wrp{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
  overflow-y: scroll;
	overflow-x: hidden;
}
.chat-date{
  width: 100px;
  margin: 0 auto;
  margin-top: 20px;
  margin-bottom: 20px;
}
.chat-date p{
  color: #707070;
  background-color: #D9D9D9;
  padding: 6px 10px;
  text-align: center;
  font-size: 14px;
  border-radius: 30px;
}
.chat-message{
  width: 80%;
  margin-left: 20px;
  max-width: 300px;
  background-color:#fff;
  padding: 10px;
  border-radius: 10px 10px 10px 0px;
  float: left;
  box-shadow: 0 1px 3px -1px rgba(0,0,0,0.3),0 1px 19px -10px rgba(0,0,0,0.1);
  margin-bottom: 10px !important;
}

.chat-message h6{
  font-size: 12px;
  color: #003169;
  font-weight: 600;
}
.chat-message h6 span{
  font-size: 10px;
  color: #707070;
}
span.ppl-pstn {
    font-size: 10px !important;
}
.chat-pic{
  width: 100%;
  height: 200px;
  overflow: hidden;
  display: block;
  position: relative;
}
.chat-pic::after {
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	position: absolute;
	left: 0;
	top: 0;
	content: "\f06e"; /* eye icon */
	font-family: "Font Awesome 6 Free";
	font-weight: 900; /* Solid */
	opacity: 0;
	color: #fff;
	font-size: 1.2rem;
	text-align: center;
	line-height: 6rem;
	transition: all ease 0.6s;
}

.chat-pic:hover::after{
  line-height: 12rem;
  opacity: 1;
  transition: all ease .6s;
}
.chat-message p{
  font-size: 13px;
  color: #1a1a1a;
  margin-bottom: 0;
  font-weight: 600;
}
/* .chat-view-wrp {
  width: 100%;
} */
.chat-message.sender{
  width: 80%;
  max-width: 300px;
  float: right;
  border-radius: 10px 10px 0px 10px;
  margin-right: 20px;
  background-color: #e7edf4;;
  margin-bottom: 20px !important;
}
.chat-message.receiver{
  margin-left: 20px;
}
.chat-message img{
  width: 100%;
  height: 100%;
  object-position: center;
  object-fit: cover;
}
/* .chat-create{
  background: #E4E4E4;
  width: 100%;
  height: auto;
  border-top: 1px solid #dedcdc;
} */
.chat-create {
	background: #E4E4E4;
	width: 100%;
	height: auto;
	border-top: 1px solid #dedcdc;
	/* position: absolute; */
	/* bottom: 0; */
  display: flex;
	box-sizing: border-box;
}
.typing-box {
	padding: 0px 15px;
	width: 100%;
  min-height: 95px;
  height: auto;
  display: flex;
  align-items: center;
}
.message-create .form-control{
  width: 100%;
  height: auto;
  background-color: #fff;
  border-radius: 10px;
  margin: 10px 0;
  padding: 10px 40px 10px 10px;
  resize: none;
}
/* .snd-btn{
  position: relative;
  width: 55px;
  height: 55px;
  background-color: #fff;
  border-radius: 50%;
  margin: 0 auto;
  top: 20px;
  text-align: center;
} */
.snd-btn {
	position: relative;
	width: 55px;
	height: 55px;
	background-color: #fff;
	border-radius: 50%;
	text-align: center;
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	color: #003169;
  transition: all ease .6s;
}
.snd-btn:hover{
  background: #003169;
  color: #fff;
  transition: all ease .3s;
}
.snd-btn span {
  color: #003169;
	font-size: 25px;
  font-weight: 600;
  top: 10px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: 0 auto;
  position: absolute;
}
.message-create p {
  font-size: 14px;
  color: #a9a9a9;
}
.modal-title {
	color: #003169;
	font-size: 18px;
	font-weight: 600;
}
.email-edit{
  background: #f1f1f1;
  padding: 15px 10px 0;
  display: inline-flex;
  width: 100%;
}
.email-edit p {
  font-size: 14px;
    color: #333;
}
span.email-field-edit{
  font-size: 14px;
  color: #003169;
  font-weight: 600;
}

.c100 > span{
  color: #003164 !important;
  font-size: 37px !important;
  font-weight: 600;
}

.c100>span.status-box {
    top: 10px;
    font-size: 12px !important;
    color: #003169;
    font-weight: 500;
}

/* .c100.count_grphcmcls{
  background: #FABC11;
}

.c100.count_grphcmcls.ps0 {
	background: #CCC;
} */

td h5{
  color: #003169;
	font-size: 16px;
	font-weight: 600;
}
td h6{
  color: #003169;
	font-size: 15px;
	font-weight: 600;
}

/* dashboard */

/*Invoice*/
.invoice-wrp {padding: 40px;}
.invoice-head {
  border-bottom: 1px solid #CCD0D5;
  padding-bottom: 20px;
  margin-bottom: 30px;
  margin-left: 0;
  margin-right: 0;
}
.invoice-brdr-btm{
  /* border-bottom: 1px solid #CCD0D5; */
  padding-bottom: 10px;
  margin-bottom: 15px;
}
.invoice-head .invoice-logo {
  width: 120px;
  height: 120px;
  object-fit: cover;
  border-radius: 50%;
  margin-bottom: 12px;
}
.invoice-head h2 {
  font-size: 22px;
  color: #003169;
  line-height: 26px;
  font-family: 'Russo One', sans-serif;
}
.invoice-wrp span.main-item-name {font-weight: 400;}
.invoice-wrp .list-group-flush .list-group-item.dot{
  margin-left: 20px;
  padding-left: 30px;
  padding-right: 0;
}
.invoice-wrp .list-group-flush .list-group-item.dot:before{left: 4px;}
.invoice-wrp .list-group-flush .list-group-item.dot:after{left: 0px;}
.invoice-dot-fields .invoice-dot-item {
  width: 100px;
  text-align: center;
  padding-left: 5px;
  margin-left: 10px;
  display: block;
  float: left;
}
.invoice-dot-item.tl {text-align: left;}
.invoice-dot-item.ml0{margin-left: 0;}
.invoice-dot-item.pl0{padding-left: 0;}
.invoice-dot-item .form-control {
  height: 32px;
  padding: 0 10px !important;
  color: #305785;
}
.invoice-dot-item.dollar-input .form-control{
  text-align: right;
  padding-left: 20px !important;
}
.invoice-dot-item.dollar-input{position: relative;}
.invoice-dot-item.dollar-input::after {
  content: '$';
  font-size: 15px;
  display: block;
  position: absolute;
  top: 0;
  line-height: 32px;
  left: 14px;
  color: #888;
}
.invoice-dot-item.items {
    text-align: left;
}
.btn-light.btn-round {
  height: 32px;
  width: 32px;
  padding: 0;
  line-height: 32px;
  font-size: 18px;
  cursor: pointer;
}
.dropdown-item:focus,
.dropdown-item:hover {
  background-color: #f3f6f9;
}
.btn-round.btn-danger{color: #ff0000;}
.custom-items-add {position: relative; padding-left: 60px;}
.custom-items-add .btn-round {position: absolute; left: 10px; top: 12px;}
.invoice-footer .invoice-dot-fields {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 5px;
}
.txt-total{color: #1F4A7B;}
.invoice-footer .invoice-dot-item .invoice-dot-item {
  width: 65px;
  float: right;
  margin-left: 0;
}
.invoice-dot-item.with-input{width: 130px;}
.invoice-dot-item.with-input label{line-height: 32px;}
.dropzone{border-radius: 10px;}

.upload-doc {
    padding: 10px 0 0 10px;
    color: #003169;
    font-weight: 500;
    font-size: 16px;
}
.listAmountView .dropzone {
  padding: 14px 14px;
  min-height: 100px;
}
.listAmountView .dropzone .dz-message {
  margin: 1em 0;
}
.amountBox::before {
  content: "$";
  position: absolute;
  left: 15px;
  width: 39px;
  height: 39px;
  background: #cfd4da;
  border-radius: 20px 0 0 20px;
  display: flex;
  justify-content: center;
  padding-left: 6px;
  align-items: center;
  color: #6683a5;
}
.amountBox input,
.amountBox .form-control {
  padding-left: 50px !important;
}
label.text-muted span {color: #003169; font-weight: 500;}

/*Chat Bubble*/
.chat-toggle {
position: fixed;
right: 10px;
/* bottom: 90px; */
bottom: 43px;
cursor: pointer;
z-index: 999;
}
.chat-toggle * {cursor: pointer;}
.chat-label {
font-size: 12px;
line-height: 14px;
color: #003169;
font-weight: 600;
display: inline-block;
text-align: right;
position: absolute;
right: 0px;
margin: 0;
bottom: 9px;
opacity: 0;
pointer-events: none;
transition: all ease .6s;
}
.chat-bubble {
  width: 40px;
  height: 40px;
  display: flex;
  background-color: #003169;
  color: #fff;
  text-align: center;
  position: relative;
  line-height: 45px;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  transition: all ease .6s;
  z-index: 9;
}
.chat-bubble:hover{
  background-color: #cecece;
  color: #003169;
  transition: all ease .3s;
}
.chat-toggle:hover .chat-label{
  right: 50px;
  opacity: 1;
  pointer-events: visible;
  transition: all ease .3s;
}
.chat-bubble span {
position: absolute;
top: -4px;
height: 16px;
display: block;
right: -7px;
line-height: 12px;
background-color: #E74C3C;
max-width: 25px;
text-align: center;
width: auto;
border-radius: 8px;
padding: 2px 3px;
font-size: 11px;
font-weight: 600;
min-width: 23px;
}
.chat-notification {
position: absolute;
right: 0;
bottom: 55px;
}
.chat-notification .chat-notif-each {
margin-top: 2px;
display: block;
width: 260px;
font-size: 14px;
color: #666;
background-color: #fff;
border: 1px solid #f9f9f9;
padding: 5px 7px;
border-radius: 3px;
line-height: 18px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.ms-drop{
  z-index: 9;
}
.text-online {
    color: #28a745 !important;
}
.alert-success{
    position: absolute;
    top: 129px;
    width: 100%;
    z-index: 9;
    font-size: 14px;
    padding: 7px;
    text-align: center;
}
.alert-success.logalert{
  top: 0;
}
.alert-success.rstpswrd{
  top: 0;
  position: relative;
  margin-top: 10px;
}

.ui-menu.srchuser-dropdown{
  max-height: 250px;
  overflow-y: scroll;
}
.modal-content{
  z-index: 99;
}
.job-place{
  display: flex;
}
#chatappnd {
	background: #ededed;
	overflow: hidden;
}

.statements {
    background: #e4edf7;
    margin-top: 50px;
}

.statements-cntnt {
    padding: 50px;
    width: 100%;
    height: auto;
}
.statements-header {
    margin-bottom: 50px;
}
.statements-header h2 {
    text-align: center;
    color: #003169;
    font-size: 30px;
    margin-bottom: 15px;
    font-weight: 600;
    font-family: 'Russo One', sans-serif;
  }
.statements-header p {
  font-size: 13px;
  text-align: center;
  color: #9c9c9c;
  font-weight: 600;
}

.statements-details h3 {
    color: #003169;
    font-size: 22px;
    font-weight: 600;
  }
.statements-details h5 {
    color: #003169;
    font-size: 18px;
    font-weight: 600;
  }

.statements-details p {
      font-size: 14px;
      line-height: 22px;
      color: #333;
      margin-bottom: 20px;
  }
ul.terms-lstng {
    margin-left: 30px;
    font-size: 13px;
}

img.abt-img {
    width: 100%;
    height: auto;
}

a.clck-dtls {
    color: #212529;
}


.loader,
.loader:after {
  border-radius: 50%;
  width: 40px;
  height: 40px;
}
.loader {
  margin:10px auto;
  position: relative;
  border-top: 0.3em solid rgba(0, 49, 105, 0.5);
  border-right: 0.3em solid rgba(0, 49, 105, 0.5);
  border-bottom: 0.3em solid rgba(0, 49, 105, 0.5);
  border-left: 0.3em solid #fff;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}





@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.custom-flex{
  display: flex;
  display: -ms-flexbox;
}

.chart-container{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.chart-container canvas{
  position: relative;
}

.chart-container .work-statics{
  position: absolute;
  z-index: 0;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  border-radius: 50%;
}

.chart-stat{
  color: #003164 !important;
  font-size: 37px !important;
  font-weight: 600;
  line-height: 35px;
}
.max80{
  max-width: 80px;
}
.max100{
  max-width: 100px;
}
.max140{
  max-width: 140px;
}
.max410{
  max-width: 410px;
}
.cstm-control {
	border: 1px solid #dfdfdf;
  border-radius: 2px;
	font-size: 14px;
  padding: 2px 10px;
  border-radius: 20px;
}
.border-top{
  border-top: 1px solid #dfdfdf;
}
.h27{height: 27px;}
.switch {
  position: relative;
  display: inline-block;
  width: 45px;
  height: 26px;
  margin: 0;
}
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.switch-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  -webkit-transition: .4s;
  transition: .4s;
  border: 2px solid #ccc;
}

.switch-slider::before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 2px;
  bottom: 1px;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

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

input:focus + .switch-slider {
  box-shadow: none;
}

input:checked + .switch-slider:before {
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  left: 20px;
  background-color: #fff;
}
/* Rounded sliders */
.switch-slider.round {
  border-radius: 34px;
}

.switch-slider.round:before {
  border-radius: 50%;
}
.businesshours-wrp{
  padding: 5px 15px;
  background-color: #ffffff;
}
.businesshours-wrp h5 {
  color: #333;
  font-size: 16px;
  line-height: 24px;
  margin: 0;
}
.businesshours-wrp > .row{padding: 10px 0;}
.time-input {
  width: 140px;
  padding: 5px 10px;
  border: 1px solid #cecece;
  border-radius: 50px;
  font-size: 15px;
  line-height: 26px;
  color: #555;
  display: block;
}
.dib label.error {
	position: absolute;
	left: 0px;
	bottom: -21px;
}
.businesshours-wrp a{color: #4d83c1;}
.input-group.date input {
  width: calc(100% - 30px);
  border-radius: 39px 0 0 39px !important;
  padding: 0 10px !important;
}
.input-group.date .input-group-addon {
  box-sizing: border-box;
  padding: 0 8px 0 5px;
  width: 30px;
  border-radius: 0 39px 39px 0;
}
.input-group.date .input-group-addon i {
  cursor: pointer;
  width: 15px;
  height: 14px;
  font-size: 14px;
}

.btn-light.btn-sm {
  height: 30px;
  padding: 6px 12px;
  margin: 2px 0;
  display: inline-block;
  font-size: 12px;
  line-height: 19px;
}
.pickup-wrp {
  background-color: #f1f1f1;
  /* margin-top: 15px; */
  border-radius: 4px;
  padding: 0px 15px;
  border: 1px dashed #dedede;
}
.pickup-head {
  display: block;
  /* border-bottom: 1px solid #ddd; */
  /* padding-bottom: 10px; */
  color: #666;
  font-size: 15px;
}
.loading{text-align: center;}
.dropdown-i-width i{
  min-width:20px;
}
.ms-drop ul > li{
  font-size: 14px;
}
.packcheckcls label{
  display: flex !important;
  align-items: flex-start;
}
.packcheckcls label span{
  white-space: normal;
  word-wrap: break-word;
}
.success-rate.rounded{
  border-radius: 1.25rem !important;
}
.card-body.card-ajax {padding: 0;}
.card-body.card-ajax .opened-box{padding: .5em 1.25em;}
.dropdown-item i {
	min-width: 20px;
  margin-right: 5px;
	text-align: center;
}
.select-small.select-box{
	height: 30px;
}
.select-small.select-box select{
	height: 30px;
	padding-left: 10px;
}
.select-small.select-box::after{
  background-position: 0 -8px;
}
.tax-bg {
    background: #fff;
    padding: 30px 0;
    height: 100%;
}
.flex-basis100{
  flex-basis: 110px;
}
.btn.btn-list {
	width: 100%;
	border-radius: 0;
	text-align: left;
	line-height: 0;
	border-top: 1px solid #dae0e5;
	padding: 15px;
  color: #003169;
  font-weight: 600;
}
.btn.btn-list i{
  min-width: 25px;
  text-align: center;
}
.btn.btn-list.active{
  background: #E7EDF4;
  position: relative;
}
.btn.btn-list.active::before{
  content: '';
  width: 5px;
  height: 100%;
  position: absolute;
  left: -1px;
  top: 0;
  background: #F2BD0B;
}
.btn-group-vertical .btn.btn-list:first-child{
  border-top: 0;
}
.btn-list:hover{
  background: #E7EDF4;
}
.info-message {
    font-size: 13px;
    color: #003169;
    font-weight: 600;
    margin-top: 20px;
    padding: 15px 0;
    background: #ffffff;
    width: 100%;
    text-align: center;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.16);
}
.border-dashed-bottom{
  border-bottom: 1px dashed #dedede;
}
.input-group .input-group-addon{
	border-radius: 20px 0 0 20px;
}
.input-group .input-group-addon + .form-control{
	border-radius: 0 20px 20px 0 !important;
}
.btn-group .btn.btn-secondary .badge{
	color: #858f9b;
	background-color: #e4eaef;
}
.cstm-control:disabled{
  background: #f1f1f2;
}
.tr.invoice-dot-item{
  text-align: right !important;
}

.search-group {position: relative;}
.search-group .form-control {padding-right: 42px !important;}
.search-group .input-group-append {
  position: absolute;
  right: 0px;
  height: 100%;
  z-index: 5;
  width: 38px;
}
.search-group .input-group-append button {
  width: 38px;
  height: 38px;
  padding: 0px;
}
.search-group .input-group-append .btn-primary:hover, .search-group .input-group-append .btn-primary:active {
  background-color: #fff;
  color: #003169;
  border-color: #ced4da;
  outline: none;
  box-shadow: none;
}
.search-group label.error {
  position: absolute;
  bottom: -18px;
  margin: 0;
  left: 20px;
  line-height: 15px;
}
.print-logo {display: none;}

.custom-multiselect{position: relative;}
.custom-multiselect::after {
  content: '';
  background: url('../../img/select-arrow.svg') no-repeat;
  background-position: 0 -3px;
  height: 33px;
  pointer-events: none;
  position: absolute;
  right: 2px;
  bottom: 4px;
  width: 33px;
  z-index: 1;
  display: block;
  border-radius: 50%;
}
h4.page-title {font-size: 26px;}
.pos-fixed{
  position: fixed;
  top:0;
  left: 0;
}
.repair-head {
    border-bottom: 1px solid #ced4da;
}
.repair-head h4{
  font-size: 17px;
  font-weight: 600;
}
.bluebrdr {
    border-top: 1px solid #557ba7;
    padding-top: 30px;
    margin-top: 30px;
}
.dz-default.dz-message span {
    display: block;
    color: #868e96;
}
.rescheduled {
  color: #D55D5D;
  font-size: 13px;
}
.link-btn{
  color: #007bff !important;
}
.rating-star-wrap a {
  color: #F2BD0B;
  cursor: default;
}
.listing-rating-wrap a{
  font-size: 13px;
  color: #F2BD0B;
}
.searchbox,
.dolar-input-wrap {
  width: 100%;
  position: relative;
}
.searchbox::before {
  content: "\f002";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  left: 14px;
  top: 7px;
  color: #8e959d;
  z-index: 9;
}
.searchbox input,
.dolar-input-wrap input{
  padding-left: 40px !important;
  width: 100% !important;
}
.signature-wrap{
  width: 150px;
}
.dolar-input-wrap::before{
  content: "$";
  position: absolute;
  left: 14px;
  top: 7px;
  color: #003169;
  z-index: 9;
}
.nav-link .badge-warning,
.dropdown-item .badge-warning {
  background-color: #e74c3c !important;
  color: #fff !important;
  font-size: 12px;
  padding-top: 5px;
}
p.stripe {
    margin: 20px 0;
    color: #003169;
    font-weight: 600;
}


.owl-nav button span {
  padding: 0 10px;
}
.owl-nav,
.owl-dots {
  text-align: center;
  display: none;
}
span.doc-up-note {
  font-size: 11px;
  padding-top: 10px;
  color: #51585e !important;
  font-weight: 500;
}
.owl-stage {
  overflow: hidden;
  height: 80px;
}
/** Paper sizes **/
body.A3 .sheet {
  width: 297mm;
  height: 419mm;
}

body.A3.landscape .sheet {
  width: 420mm;
  height: 296mm;
}

body.A4 .sheet {
  width: 210mm;
}

body.A4.landscape .sheet {
  width: 297mm;
  height: 209mm;
}

body.A5 .sheet {
  width: 148mm;
  height: 209mm;
}

body.A5.landscape .sheet {
  width: 210mm;
  height: 147mm;
}

body.letter .sheet {
  width: 216mm;
  height: 279mm;
}

body.letter.landscape .sheet {
  width: 280mm;
  height: 215mm;
}

body.legal .sheet {
  width: 216mm;
  height: 356mm;
}

body.legal.landscape .sheet {
  width: 357mm;
  height: 215mm;
}

/** Padding area **/
.sheet.padding-10mm {
  padding: 10mm;
}

.sheet.padding-15mm {
  padding: 15mm;
}

.sheet.padding-20mm {
  padding: 20mm;
}

.sheet.padding-25mm {
  padding: 25mm;
}

.btn-group.btn-group-dropdown {box-shadow: none;}
.btn-group.btn-group-dropdown .dropdown a.btn{border-radius: 0px;}
.btn-group.btn-group-dropdown .dropdown:first-child a.btn{border-radius: 50px 0 0 50px;}
.btn-group.btn-group-dropdown .dropdown:last-child a.btn{border-radius: 0px 50px 50px 0;}

.menu-bar .nav-link .badge{
  vertical-align: middle;
  margin-top: -3px;
}
.bootstrap-datetimepicker-widget.dropdown-menu.top{z-index: 10000;}
.text-warning-dark{color: #d68f03 !important}
.white-rating-wrap{
  width:85px;
  height: 17px;
  display: inline-block;
  position: relative;
}
.white-rating-bg{
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: #f0bc2e;
  z-index: 1;
}
.white-rating-wrap img{
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
}
.smsNot{position: relative;}
.smsNot span {
  position: absolute;
  width: 8px;
  height: 8px;
  background: red;
  border-radius: 50%;
  top: 4px;
  right: 4px;
}
.cont-img {
  height: 70px;
  width: 90px;
  overflow: hidden;
  border-radius: 4px;
  flex: 0 0 auto;
}
.cont-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.cont-details p {
  color: gray;
}
.cont-details h5 {
  color: #003169;
  margin-top: 11px;
}
.audiencetitle {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  color: #003169 !important;
  font-size: 16px;
  margin: 0;
  padding-top: 4px;
}
.contentBox{
  border-radius: .75rem !important;
  resize: vertical;
  display: block;
  width: 100%;
  padding: 0.15rem 1.10rem;
  font-size: 1rem;
  line-height: 2.3 !important;
  color: #495057;
  background-color: #fff;
  background-image: none;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  font-size: 14px !important;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.selCondtion span {
  background: #f1f8ff;
  padding: 5px 11px;
  border-radius: 20px;
  border: 1px solid #dce2e8;
  margin-bottom: 5px;
}
.selCondtion span p {
  display: inline;
  font-weight: 400;
  color: #495057;
}
.selCondtion span a i{
  color: #003169;
}
.selCondtion {
  border: 1px dashed #ced4da;
  border-radius: 14px;
}
li.main-item-name.active {
  background: #f1f8ff;
}
li.nav-item {
  text-transform: uppercase;
}
.customcontent-head{
  font-size: 16px;
  font-weight: 600;
}
.customcontent-p{
  line-height: 22px;
  color: #475463 !important;
}

@media(max-width:500px){
  .cont-details p {
    font-size: 10px;
  }
  .cont-details h5 {
    font-size: 15px;
    margin-top: 3px;
  }
  .cont-img {
    height: 60px;
  }
}


.mainBtn {
  font-size: 11px;
  padding: 6px 15px;
  margin-bottom: 3px;
  height: 30px;
}
.dropdown-item.active,
.dropdown-item:active {
  color: #003169;
  background-color: #f3f6f9 !important;
}

.views {
  display: flex;
  text-align: center;
}
.view-status {
  padding: 10px;
}
.view-status-brdr{
  border-right: 1px dashed #6992bf;
}
.view-status p {
  margin-bottom: 5px;
  font-size: 13px;
  color: gray;
}
.view-status span {
  font-size: 25px;
  color: #003169;
}

/** Fix for Chrome issue #273306 **/
@media print {
  body.A3.landscape {
    width: 420mm
  }

  body.A3, body.A4.landscape {
    width: 297mm
  }

  body.A4, body.A5.landscape {
    width: 210mm
  }

  body.A5 {
    width: 148mm
  }

  body.letter, body.legal {
    width: 216mm
  }

  body.letter.landscape {
    width: 280mm
  }

  body.legal.landscape {
    width: 357mm
  }
}

.contentImg {
  width: 100%;
  height: 280px;
  margin-bottom: 15px;
  border-radius: 5px;
  overflow: hidden;
}
.contentImg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.colseBtn {
  position: absolute;
  right: 10px;
  top: 20px;
}
.noteDate {
  text-align: right;
}
p.payType {
  text-align: right;
  font-size: 12px;
}
ul.list-group.list-group-flush li:first-child {
  border-top: 0 !important;
}
.apprlAmount {
  color: #003169;
  font-size: 14px;
  font-weight: 600;
  padding-left: 6px;
}
.dateBtn {
  text-align: right;
}

span.new-badge i {
  color: #FF6000;
}
span.assigned i {
  color: #FFA500;
}
span.accepted-icon i {
  color: #36bd36;
}
span.declined {
  color: red;
}
span.timeout {
    color: #6699CC;
}
span.AppStatus {
  font-size: 13px;
  font-weight: 600;
  color: #003169;
}
.certificateView {
  /* height: 300px; */
  width: 100%;
  display: none;
}
.certificateView img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left;
}
.certificateView.show {
  display: block;
}
.cert-btn,
.cert-btn:focus {
  font-size: 12px;
  color: #4a83c3;
  font-weight: 600;
}
.btn.btn-outline-primary {
  height: 38px;
  border-radius: 25px;
  background: #f7f9fb;
  font-family: "Russo One";
  font-weight: normal;
  font-size: 13px;
  text-align: center;
  color: #003169;
  line-height: 15px;
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.16);
  border: 2px solid #003169;
}
.btn.btn-outline-primary:hover {
  background: #fff;
  color: #f2bd0d;
  border-color: #fff;
}
.audience-Sel {
  display: flex;
  align-content: center;
}
.orders-select {
  height: 110px;
  overflow-y: scroll;
}
.nav-link.pickup-menu {
  position: relative;
}
.nav-link.pickup-menu::before{
  right: 2px;
}
.btn-chat-attachment.btn-chat-attachment-vdo {
  right: 35px;
  color: #003169;
}
.btn-chat-attachment.btn-chat-attachment-cptr {
  right: 50px;
  color: #003169;
}
.btn-chat-attachment.btn-chat-attachment-vdo input {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
video.chat-vdo {
  max-height: 200px;
}
a.rmv-cht {
  font-size: 13px;
  color: #d70000;
  margin-right: 5px;
}
.btn-chat-attachment.btn-chat-no-video {
  right: 25px;
}
/* ---------- rensponsive ---------------- */


@media (min-width: 992px) {
  .container {
    max-width: 1050px;
  }
}
@media (min-width: 767px) {
  .container {
    min-width: 850px !important;
  }
}


@media (min-width: 1400px) {
  .navbar-expand-xl .navbar-toggler {
    display: none !important;
  }
}
@media (max-width:1400px) {
  .res-menu {
    position: fixed;
    width: 400px;
    max-width: 100%;
    right: -1000%;
    height: 100%;
    background-color: #ffffff;
    padding: 30px 40px;
    padding-top: 130px;
    transition: 0.3s ease all;
    display: block;
    z-index: 99;
    box-shadow: -3px 0px 16px 3px rgba(0, 0, 0, 0.10);
    pointer-events: none;
    text-align: left;
    top: 0;
  }
  .apprl-alert::before {
    right: initial;
    top: 9px;
    left: 122px;
  }


.itBtn {
  margin-left: 15px;
}
  .menu-open .res-menu {
    right: 0px;
    pointer-events: visible;
    overflow: scroll;
  }

  .navbar-expand-xl .navbar-nav {
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .menu-bar .nav-link {
    font-size: 17px;
    padding: 10px;
  }

  .nav-item .btn-primary {
    font-size: 17px;
    padding: 10px 15px;
  }
  .menu-bar .nav-item .dropdown-item {
    text-align: left;
    display: inline-block;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  li.nav-item .btn {
    margin-top: 20px;
  }
  .navbar-expand-xl .navbar-nav .dropdown-menu {
    position: relative;
    box-shadow: none;
    background: #f8f9fa;
  }
  .navbar-expand-xl .navbar-nav .dropdown-menu {
    padding: 0;
  }
  .dropdown-item.active,
  .dropdown-item:active {
    background-color: #f8f9fa;
  }
  li.nav-item.dropdown {
    width: 100%;
  }
  .berBg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #00000080;
    z-index: 9;
    display: none;
    transition: ease-in-out 1s all;
    -webkit-transition: ease-in-out 1s all;
    -moz-transition: ease-in-out 1s all;
    -ms-transition: ease-in-out 1s all;
    -o-transition: ease-in-out 1s all;
}
  .dropdown-toggle::after {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
}
  .menu-bar .nav-item .dropdown-menu.show {
    position: relative;
    text-align: left;
    margin: 10px auto;
    width: 100%;
    right: 0;
    left: initial;
    top: 0;
  }
}

@media (max-width:1366px){
  
}

@media (min-width: 1199px) {
  .navbar-expand-xl .navbar-toggler {
    display: initial;
  }
  .navbar-expand-xl .navbar-collapse {
    display: initial !important;
  }
}
@media (max-width: 1199px){
    .application{ margin: 50px 50px;}
    .app-details { margin-top: 75px;}
    .app-details img{ padding-bottom: 20px;}
    .job-details-status{height: 53px; width: 53px; margin: 10px 3px;}
    .job-details-status span{font-size: 39px;}
    .job-details-txt h5 { font-size: 14px; margin-bottom: 5px;}
    .job-details-txt{ margin: 5px;}
    .chat-section{margin-bottom: 50px;}
    /* .message-create .form-control{width: 525px;} */
    

  	.menu-bar .navbar-nav {border: none; margin-bottom: 50px;}
  	.menu-bar .nav-link {
      font-size: 17px;
      line-height: 27px;
      padding: 13px 15px 7px;
      display: inline-block;
    }
  	.res-pro {
  		margin-left: 0;
  		padding-top: 0;
  		position: absolute;
  		top: 18px;
  		right: 0px;
  		display: block;
          z-index: 100;
      }
      /* .tax-error label.error{left:-15px}
      .menu-bar .nav-item .dropdown-menu.show {
        position: relative;
        text-align: center;
        margin: 10px auto;
      } */
      .admin-logo {width: 70px;}
      footer{position: relative;}
      /* .chat-toggle {bottom: 45px;} */
      
      .views {
        text-align: center;
        flex-direction: column;
        margin-top: 0 !important;
      }
      .view-status-brdr {
        border-right: 0;
        padding: 0;
        border-bottom: 1px dashed #6992bf;
      }
      .view-status span {
        font-size: 18px;
      }
      .view-status p {
        margin-bottom: 0px;

      }

}


@media (max-width: 991px) {
    .banner{height: 320px;}
    .banner-content{padding: 100px 0 20px;}
    .banner-content h1{font-size: 35px; line-height: 40px;}
    .app-details{margin-top: 50px; text-align: center;}
    .app-details h2{font-size: 30px;line-height: 35px;}
    .app-details img {width:180px; height:auto;}
    .mobile-section{text-align: center;}
    .mission p{padding-left: 0;}
    .vision{margin-top: 30px;}
    .vision-content{width: 100%;}
    .vision-content h3{ padding: 0 30px; }
    .vision-content p { padding: 0 30px !important;}
    .mobile-section img{ width:300px; height: auto;}

    .job-details-status{
      margin: 10px 0;
    }
    .nav-tabs .nav-link{font-size: 11px;}
    .job-details-status{height: 53px; width: 53px; margin: 10px 3px;}
    .job-details-status span{font-size: 34px;}
    .job-details-txt h5 { font-size: 13px; margin-bottom: 5px;}
    .job-details-txt{ margin: 5px;}
    .chat-section{margin-bottom: 50px;}
    /* .message-create .form-control{width: 365px; height: 60px; font-size: 13px !important;} */
    .snd-btn{width: 45px; height: 45px;}
    .snd-btn span{font-size: 20px;top: 8px;}
    .btn-options{ width:25px; height: 25px; font-size: 13px;}

    .paid a {font-size: 9px; margin-right: 5px;}
    .nav-link.dropdown-toggle + .dropdown-menu{text-align: center;}
    .tax-error label.error{left:-8px}
    .tax-error label.error{left:-15px}
    .time-input {min-width: 110px; margin: 0 4px;}
    .invoice-dot-fields .invoice-dot-item {width: 90px;}
    .aging-modal-dialog {max-width: 700px; margin: 10px auto;}
    .aging-modal-dialog .small-select.select-box select {padding-left: 6px;}
    .menu-bar .nav-item .dropdown-menu.show {
      width: 80%;
    }
    .res-menu {
      padding: 90px 50px;
    }
}
@media (max-width: 767px) {
    .footer-app img{width: 115px; height: auto;}
    .footer-bottom{text-align: center;}
    .ic-logo {text-align: center; float: none; margin-top: -15px;}
    .footer-bottom  {margin: 0;}
    .vision-content img{margin: 0 20px;}

    .login-banner{display: none;}
    .login-section{width: 400px; height: auto; padding-top: 25px;}
    .login-footer p{ text-align: center;}
    .login-ic-logo {float: none; text-align: center;}
    /* .success-rate2{height: 350px;} */
    .chat-section{margin-bottom: 50px; height: auto;}
    .chat-peoples{
      height: auto;
      width: 100%;
      max-width: 100%;
      display: block;
    }
    .apprl-alert::before {
      left: 94px;
    }
    .chat-search {
      width: 100%;
      max-width: 100%;
    }
    span.chat-close {display:inline;}
    .message-create .form-control{ height: 80px; font-size: 13px !important; line-height: 20px !important;}
    .snd-btn{width: 45px; height: 45px;}
    .snd-btn a{font-size: 19px;top: 10px;}
    .paid a { margin: 0; font-size: 7px;padding: 4px 2px;}
    .chat-box { width: 100%; height:100%;  position: fixed; top: 0px; right: -100%; transition: 0.3s ease; z-index: 9999; background: #EDEDED; display: none;}
    .chat-box.active { right: 0; display: flex;}
    /* .chat .chat-view-wrp .chat-wrp:last-of-type{margin-bottom: 100px;} */
    .res-overflow-sm{overflow: hidden; overflow-x: scroll;}
    .res-overflow-sm ul.invoice-brdr-btm, .res-overflow-sm > table{min-width: 590px;}
    .res-overflow-sm ul.invoice-brdr-btm .invoice-dot-fields {align-self: end;}
    .container .btn-group {
      box-shadow: none;
      border-radius: 0;
      /* display: flex; */
      flex-wrap: wrap;
      justify-content: center;
    }
    .container .btn-group .btn-light {
      margin: 2px;
      box-shadow: none;
      border: 1px solid #e9e9e9;
    }
    .aging-modal-dialog {max-width: 100%; margin: 10px;}
    .menu-bar .nav-link {
      font-size: 13px;
    }
    .dropdown-menu .dropdown-item {
      font-size: 13px;
    }
.mobRight {
  text-align: right;
}
.dateBtn {
  text-align: center;
}

}
@media (max-width: 575px) {
    .logo{text-align: center;}
    .logo img{width:65px; height:auto;}
    .menu{margin: 5px 0 0;}
    .menu ul{text-align: center; float: none;}
    .menu ul{padding: 0 10px 0 0;}
    .menu ul li a{font-size: 12px;}
    .banner-content{padding: 50px 0 20px;}
    .banner-content h1 {font-size: 25px; line-height: 30px; text-align: center;}
    .bottom-left {text-align: center; padding-bottom: 15px;}
    .bottom-right {float: none;text-align: center;}
    .bottom-right a {padding: 0 10px 0 10px ;}
    .application{margin: 25px 25px;}
    .app-details img { width: 120px; height: auto;}
    .app-details h2{font-size: 25px;line-height: 28px;}
    .app-details img { padding-bottom: 10px; }
    .mobile-section img{ width: 190px; height: auto;}
    .vision-content img{ width: 50px; height: auto; padding: 10px;}
    .mission h3{font-size: 30px; line-height: 33px; margin-bottom: 10px;}
    .vision h3{font-size: 30px; line-height: 33px; margin-bottom: 10px;}
    .contact {margin:0 0 50px;}
    .contact h2{font-size: 35px;margin-bottom: 30px;}
    .footer-content{text-align: center;}
    .footer-content h6 {margin-bottom: 0px;}
    .footer-app{ margin: 10px 0 15px 0;}
    .footer-social{margin-top: 5px;}
    .footer-social a {padding: 10px;}
    .login-section{width: 100%; height: auto;}
    /* .login-ic-logo {margin: 0 auto; left: 0; right: 0;  position: absolute;  margin-top: 45px;} */
    /* .success-rate2{height: 460px;} */
    .success-rate h6 {text-align: center; margin-bottom: 20px;}
    .page-title { font-size: 23px;}
    /* .success-rate { height: 250px; border-bottom: 1px solid #e8e8e8;} */
    .c100{font-size:100px !important;}
    .job-orders-status h6{font-size: 17px; margin-top: 10px;}
    .job-details-status { height: 55px; width: 55px; margin: 0 auto;}
    .job-details-status span{font-size: 40px;}
    .job-details { display: inline-block; align-items: center; justify-content: center;}
    .job-details-txt{text-align: center;}
    nav { display: flex; justify-content: center;}
    .btn-primary{ min-width: 130px; height: 40px; font-size: 12px; padding: 10px; }
    .message-create p{font-size: 12px;}
    .snd-btn{width: 50px; height: 50px;}
    .snd-btn a{font-size: 20px;}
    .border-secondary { overflow: hidden; overflow-x: scroll; white-space: nowrap;}
    /* .btn-secondary{width:150px;} */
    .paid a {font-size: 10px; padding: 4px 6px;}
    .srv-head {justify-content: center;}
    .inquiry-heading p.date{font-size:12px; float:none; text-align: center;}
    .inquiry-heading h3 { text-align: center;padding-top: 10px; font-style: 18px;}
    .inquiry-heading p{font-size: 13px;}
    .inquiry-heading h2{font-size: 18px; margin-bottom: 10px;}
    .invoice-head .invoice-logo{width: 100px; height: 100px;}
    .inquiry-comment-list p { font-size: 13px; line-height: 19px;}
    .file-view{width:75px; height: 75px;}
    span.filename{width: 75px;}
    .job-place {display: block;}
    .opened-box .opened-boxhead-box h3{font-size: 14px;line-height: 18px;}
    .service-count{margin-right: 0px;}
    .responsive-btn-grp .btn{padding: 10px; font-size: 13px;}
    .c100 > span{font-size: 30px !important; ine-height: 3.4em !important;}
    .statements-header {margin-bottom: 30px;}
    .statements-header h2 {font-size: 20px}
    .statements-comming-soon {width: 100%}
    .statements-comming-soon h1{font-size: 20px}
    .search-group {max-width: 250px; margin: 0 auto;}
    .res-aging-pop{
      overflow: hidden;
      overflow-x: scroll;
    }
    .res-aging-pop > div{min-width: 555px;}
    .menu-bar .nav-item .dropdown-item {
      text-align: left;
    }
    .menu-bar .nav-item .dropdown-menu.show {
      position: relative;
      text-align: left;
      margin: initial;
      width: 100%;
    }
    
    .dropdown-toggle::after {
      transform: rotate(0deg);
    }
    .res-menu {
      width: 100%;
    }
    .noteDate {
      text-align: left;
    }
    .audience-Sel {
      display: initial;
    }
}
@media print {
    .header-wrp, .login-footer, .chat-toggle, .hide-print{display: none !important;}
    .print-logo {display: block;}
    .print-logo .admin-logo {
      display: block;
      margin: 20px auto 30px;
      width: 140px;
    }
    .wrapper {
      max-width: 29cm;
      margin: 60px auto 0;
    }
    .print-logo h4 {
      text-align: center;
      margin-bottom: 18px;
      font-size: 24px;
      font-weight: normal;
      color: #003169;
      line-height: 26px;
    }
  }



@media (min-height: 769px) {
  footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    z-index: 99;
  }
  .wrapper {margin-bottom: 70px;}
  /* .chat-toggle {bottom: 70px;} */
}

@media (max-width: 1450px) and (min-width: 1399.98px) {
 .navbar .admin-logo {
    width: 70px;
  }
}