html {
  font-family: "Roboto", sans-serif;
  font-weight: normal;
  font-size: 14px;
  color: #212121;
}

html,
body {
  height: 100%;
  min-height: 100%;
}

body {
  animation: fadein 2s;
  -moz-animation: fadein 2s;
  -webkit-animation: fadein 2s;
  -o-animation: fadein 2s;
  background-color: #dcdcdc;
}

@keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-moz-keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-webkit-keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-o-keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@font-face {
  font-family: "fontello";
  src: url("../fonts/fontello/fontello.eot?58252796");
  src: url("../fonts/fontello/fontello.eot?58252796#iefix")
      format("embedded-opentype"),
    url("../fonts/fontello/fontello.woff?58252796") format("woff"),
    url("../fonts/fontello/fontello.ttf?58252796") format("truetype"),
    url("../fonts/fontello/fontello.svg?58252796#fontello") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
}

.icon-right-open-3:before {
  content: "\edb3";
}

.icon-left-4:before {
  content: "\edb1";
}

.icon-right-4:before {
  content: "\edaf";
}

.icon-left-4:before {
  content: "\edb1";
}

.icon-down-open-big:before {
  content: "\e8c0";
}
.icon-up-open-big:before {
  content: "\ea85";
}

.icon-camera-7:before {
  content: "\f033";
}

.icon-plus-1:before {
  content: "\ea16";
}

.icon-sliders:before {
  content: "\e8a0";
}

.icon-attach-1:before {
  content: "\ea22";
}

.deviceImg {
  width: 84px !important;
}

.icon-attach-2:before {
  content: "\002B";
}

.icon-cancel-1:before {
  content: "\ea13";
}

.icon-down-open-big:before {
  content: "\ea88";
}

.icon-eye-2:before {
  content: "\eb69";
}

.icon-pencil:before {
  content: "\e883";
}

.icon-ellipsis-vert:before {
  content: "\e92d";
}

.icon-camera-7:before {
  content: "\f033";
}

.icon-cloud-8:before {
  content: "\f038";
}

.icon-download-5:before {
  content: "\ed86";
}

.icon-angle-right:before {
  content: "\e8cc";
}
.icon-plus-circled-1:before {
  content: "\ea17";
}

.icon-cancel-circled-2:before {
  content: "\eb32";
}

.icon-down-open-big:before {
  content: "\ea88";
}
.icon-bell:before {
  content: "\e878";
}
.icon-sliders:before {
  content: "\e8a0";
}
.icon-search:before {
  content: "\e824";
}

.icon-plus-1:before {
  content: "\ea16";
}

.icon-warning-empty:before {
  content: "\eb79";
}

.marginRigh {
  margin: 0 10px 0 0 !important;
}

.plus {
  font-size: 40px !important;
  color: #cacaca;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: normal;
  padding: 0;
  margin: 0;
  font-weight: 600;
}

.containerHeader {
  max-width: 1264px;
  width: 100%;
  position: relative;
  margin: 0 auto;
}

.headerInnerDiv {
  float: left;
  width: 100%;
  padding: 0 24px;
}

.container {
  max-width: 1264px;
  width: 100%;
  position: relative;
  margin: 0 auto;
}

.actionBtnBox {
  width: 100%;
  float: left;
  padding: 0 3px 0 4px;
  margin: 30px 0 10px 0;
}

@media only screen and (max-width: 600px) {
  .filterActionBox {
    position: fixed !important;
    margin: 30px 0 0px 0;
    padding: 0px !important;
  }
  .filterFormDiv {
    bottom: 50px !important;
  }
}

/**************** Header Start *********************/

nav a.button-collapse {
  display: block;
}

nav {
  color: #fff;
  width: 100%;
  height: 80px;
  background-color: #012b72;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12);
}

nav .brand-logo {
  left: 0;
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
}

nav .brand-logo {
  position: relative;
}

nav .button-collapse {
  float: left;
  position: relative;
  z-index: 0;
  height: auto;
  margin: 0;
}

nav .button-collapse i {
  height: auto;
  color: #fff;
  line-height: 70px;
}

.brandLogo {
  width: auto;
  float: left;
  margin: 17px 0 0 26px;
}

.rightSecBox {
  float: right;
  width: auto;
}

.rightSecBox .sbox {
  float: left;
  width: auto;
  margin: 10px 38px 0 0;
  cursor: pointer;
}

.rightSecBox .profilePicBox {
  float: right;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  margin: 12px 0 0 0;
}

.rightSecBox .userName {
  font-size: 16px;
  line-height: 1.25;
  color: #ffffff;
  width: auto;
  float: left;
  margin: 26px 16px 0 0;
}

/**************** Header End *********************/

.bodySec {
  width: 100%;
  float: left;
}

.bodySec .headerFilterBox {
  width: 100%;
  height: 86px;
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  background-color: #ffffff;
  z-index: 1;
  position: relative;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12);
  margin: -10px 0 0 0;
}

.bodySec .headerFilterBox .leftSecDiv {
  float: left;
  width: auto;
}

.bodySec .headerFilterBox .leftSecDiv h1 {
  font-size: 20px;
  line-height: 1.3;
  width: 100%;
  clear: both;
  margin: 8px 0 0 0;
  color: #222222;
  font-weight: normal;
  text-transform: capitalize;
}

.bodySec .headerFilterBox .leftSecDiv .sutTextBox {
  width: 100%;
  clear: both;
  font-size: 14px;
  line-height: 1.43;
  color: #7a7a7a;
  margin: 4px 0 0 0;
  float: left;
}
.paddding04{
  padding: 4px 0 0;
}
.marginTop20{
  margin: 24px 0 0;
}
.bodySec .headerFilterBox .leftSecDiv .sutTextBox p {
  float: left;
  margin: 0;
  padding: 0;
}

.filterBtn {
  width: auto;
  height: 32px;
  border-radius: 2px;
  background-color: #fafafa;
  box-shadow: 0 0 2px 0 #dcdcdc;
  position: relative;
  border: solid 1px #dcdcdc;
  margin: 21px 0 0 0;
  float: right;
  cursor: pointer;
  padding: 0 14px;
}

.filterBtn.disabled {
  opacity: 0.4;
  cursor: auto;
}

.closeBtn {
  height: 32px;
  border-radius: 2px;
  margin: 21px 0 0 0;
  float: right;
  cursor: pointer;
  background-color: #dadada;
  box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.24);
  border: solid 1px #dcdcdc;
  padding: 0 14px;
}

.bodySec .headerFilterBox .iconImg {
  font-size: 17px;
  color: #525252;
  float: left;
  margin: 3px 0 0 0;
}

.bodySec .headerFilterBox span {
  font-size: 14px;
  color: #212121;
  float: left;
  margin: 5px 0 0 10px;
}

.rTable {
  display: table;
  width: 100%;
}

.rTableRowHeading {
  display: table-row;
  background: #fff;
  padding: 0 9px;
  overflow: hidden;
  float: left;
  width: 100%;
  border-radius: 2px;
  background-color: #eeeeee;
  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12);
}

.rTableHead {
  display: table-cell;
  text-transform: uppercase;
  padding: 24px 15px;
  font-size: 10px;
  font-weight: bold;
  line-height: 1;
  letter-spacing: 1px;
  text-align: left;
  color: #7a7a7a;
  float: left;
}

.rTableRow {
  display: table-row;
  background: #fff;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
  margin: 2px 0;
  float: left;
  width: 100%;
  cursor: pointer;
  position: relative;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12);
}

.activeRow {
  border: solid 1px #008df6;
  background: #f2f9fe;
}

.arrowActive {
  position: absolute;
  right: -7px;
  top: 40%;
  background: url(../images/activeRowArrow.png?1780752732463) no-repeat 0 0;
  width: 7px;
  height: 11px;
}

.padd15 {
  padding: 0 9px;
  float: left;
  width: 100%;
  min-height: 69px;
  height: auto;
  border-radius: 2px;
}

.rTableCell {
  float: left;
  padding: 20px 10px 10px 10px;
  line-height: 19px;
  font-size: 14px;
  line-height: 1.43;
  text-align: left;
  color: #212121;
  word-break: break-word;
}

/************ SOS Width:Start************/

.sos01 {
  width: 16.6%;
}

.sos02 {
  width: 23.5%;
}

.sos03 {
  width: 23.5%;
}

.sos04 {
  width: 21.3%;
}

.sos05 {
  width: 15.1%;
}

.sos001 {
  width: 14.6%;
}

.sos002 {
  width: 15.5%;
}

.sos003 {
  width: 19.5%;
}

.sos004 {
  width: 19.3%;
}

.sos005 {
  width: 17.1%;
}

.sos006 {
  width: 14%;
}

.sosType02 {
  width: 13.5%;
}
.sosType03 {
  width: 15.5%;
}
.sosType04 {
  width: 17.1%;
}
.sosType05 {
  width: 11.5%;
}
.sosType06 {
  width: 11.5%;
}
.sosType07 {
  width: 17.1%;
}
.sosTypePayment {
  width: 10%;
}
.sosType {
  width: 11%;
}
/************ SOS Width:End************/

.tableFormatFilter {
  width: 100%;
  float: left;
  position: relative;
}

.tableSrnView {
  width: 71%;
  float: left;
}
@media only screen and (max-width: 600px) {
  .mobileScreen {
    width: 100% !important;
    display: block !important;
  }
}

.submitCancel {
  width: 100% !important;
}

.rightSlideSec {
  border-radius: 2px;
  background-color: #ffffff;
  width: calc(29% - 8px);
  float: right;
  position: absolute;
  right: 0;
  top: 8px;
  bottom: 0;
  z-index: 1;
  box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.15), 0 0 12px 0 rgba(0, 0, 0, 0.11);
  border: solid 1px #dcdcdc;
  min-height: 600px;
}

.rightSlideSec form {
  border: none;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}

.rightSlideSec fieldset {
  border: none;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}

.mobileFormSec fieldset {
  border: none;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}

.filterSlideSec {
  border-radius: 2px;
  background-color: #ffffff;
  width: calc(29% - 8px);
  float: right;
  position: absolute;
  right: 0;
  top: -93px;
  z-index: 2;
  box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.15), 0 0 12px 0 rgba(0, 0, 0, 0.11);
  border: solid 1px #dcdcdc;
  min-height: 340px;
  /*height: auto;*/
}

.filterSlideSec .topArrow {
  position: absolute;
  left: 28%;
  top: -7px;
  background: url(../images/topArrow.png?1780752732463) no-repeat 0 0;
  width: 11px;
  height: 7px;
}

.formSecDiv {
  padding: 16px 16px 20px 16px;
  width: 100%;
  float: left;
  background-color: #fff;
  /* height: 500px; */
  max-height: calc(100% - 70px);
  overflow: auto;
}
.damegeDetails label{
  display: block !important;
  padding: 0 0 16px;
  height: auto !important;
  color: #7A7A7A;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 22px;
}
.damegeDetails [type="radio"]:checked + label:last-child{
  padding: 0 0 24px;
}
.formSecDiv .damegeDetails p{
    padding: 0 0 24px;
    margin: 0;
}
.damegeDetails ul{
  padding: 0 0 16px;
}
.damegeDetails span{
  color: #222222;
  padding: 8px 0 12px;
  display: block;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 22px;
  clear: both;
}
.damegeDetails ul li{
  color: #222222;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 22px;
}
.damegeDetails h6{
    padding: 0 0 12px; 
    color: #222222;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 20px;
}
.damegeDetails  [type="radio"]:checked + label{
  color: #222222;
}
.damegeDetails ul{
  margin: 0;
}
.formSecDiv h3 {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.25;
  width: 100%;
  float: left;
  color: #222222;
}
.invoiceImgSec p{
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  padding: 4px 0 12px;
  margin: 0 !important;
  color: #222222;
}
.formSecDiv p {
  font-size: 16px;
  line-height: 1.38;
  width: 100%;
  float: left;
  margin: 12px 0 0 0;
  color: #222222;
}

.formSecDiv .textBtnBox {
  width: 100%;
  float: left;
  margin: 12px 0 24px 0;
}

.formSecDiv .textBtnBox2 {
  margin: 12px 0 12px 0;
}
.formSecDiv .textBtnBox span {
  font-size: 16px;
  line-height: 1.38;
  width: auto;
  float: left;
  color: #222222;
}

.actionBox {
  position: absolute;
  z-index: 2;
  bottom: 8px;
  left: 8px;
  right: 8px;
}

.actionBoxMobile {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 20px 4px;
  background: #fff;
  box-shadow: 0 -2px 4px 0 rgba(0, 0, 0, 0.08);
  z-index: 1;
}

.cancel {
  background: #7a7a7a;
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}

.cancel:hover {
  background: #7a7a7a;
  box-shadow: none;
}
.pendingEst .inputDefBox{
  margin: 0;
  height: 70px;
}

.pendingEst .inputDefBox{
  margin: 0;
  height: 70px;
}
.pendingEst .inputDefBox2{
  height: 80px;
}
.pendingEst .deviceModel{
  margin: 0;
  height: auto;
}
.checkBox{
  clear: both;
  padding: 18px 0 28px;
  display: flex;
}
.checkBox .input-field{
  margin: 0;
}
.checkBox .input-field label{
  position: relative;
  top: 0;
}
.pendingEst .textBtnBox{
  display: flex;
  align-items: center;
}
.pendingEst .textBtnBox span {
  font-size: 14px;
  line-height: 24px;
  width: 65%;
}
.pendingEst .inputDefBox .input-field label{
  width: 100%;
  top: 0;
}
.pendingEst .inputDefBox .input-field label img{
  cursor: pointer;
  position: absolute;
  right: 0;
  bottom: 0;
}
.pendingEst .input-field label.active{
  font-size: 14px;
  color: #7A7A7A;
    margin: 18px 0 0;
    height: 30px;
}
.pendingEst .input-field label.active img{
  bottom: -18px;
}
.pendingEst .selectrDefBox .damageTypeDropdown .select-wrapper{
  padding: 4px 0 0;
}
.pendingEst .input-field label{
  font-size: 16px;
}
.pendingEst .checkBox label{
  color: #222222;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 20px;
}

.pendingEst .dateFont {
  font-size: 20px !important;
}
.pendingEst [type="checkbox"].filled-in:checked + label:before{
  top: -1px;
  left: 0px;
}
.pendingEst [type="checkbox"] + label{
  padding-left: 32px;
}
.pendingEst [type="checkbox"].filled-in:not(:checked) + label:after,
.pendingEst [type="checkbox"].filled-in:checked + label:after
{
  height: 18px;
  top: 0px;
  width: 18px;
}
.add:hover {
  background: #008df6;
  box-shadow: none;
}

.add {
  background: #008df6;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  border-left: solid 1px #fff;
}

.btn {
  width: 50%;
  margin: 0;
  padding: 0;
  box-shadow: none;
  float: left;
  height: auto;
  line-height: 20px;
  padding: 16px 0;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 2px;
  z-index: 0;
}

/* Text inputs */

input:not([type]),
input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
input[type="time"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="tel"],
input[type="number"],
input[type="search"],
textarea.materialize-textarea {
  border-bottom: 1px solid #dcdcdc;
  color: #7a7a7a;
}

.select-wrapper input.select-dropdown {
  border-bottom: 1px solid #dcdcdc;
}

input:not([type]),
input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
input[type="time"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="tel"],
input[type="number"],
input[type="search"],
textarea.materialize-textarea {
  font-size: 20px;
  color: #222222;
  margin: 0;
}

input:not([type]):focus:not([readonly]) + label,
input[type="text"]:focus:not([readonly]) + label,
input[type="password"]:focus:not([readonly]) + label,
input[type="email"]:focus:not([readonly]) + label,
input[type="url"]:focus:not([readonly]) + label,
input[type="time"]:focus:not([readonly]) + label,
input[type="date"]:focus:not([readonly]) + label,
input[type="datetime"]:focus:not([readonly]) + label,
input[type="datetime-local"]:focus:not([readonly]) + label,
input[type="tel"]:focus:not([readonly]) + label,
input[type="number"]:focus:not([readonly]) + label,
input[type="search"]:focus:not([readonly]) + label,
textarea.materialize-textarea:focus:not([readonly]) + label {
  color: #008df6;
}

input:not([type]):focus:not([readonly]),
input[type="text"]:focus:not([readonly]),
input[type="password"]:focus:not([readonly]),
input[type="email"]:focus:not([readonly]),
input[type="url"]:focus:not([readonly]),
input[type="time"]:focus:not([readonly]),
input[type="date"]:focus:not([readonly]),
input[type="datetime"]:focus:not([readonly]),
input[type="datetime-local"]:focus:not([readonly]),
input[type="tel"]:focus:not([readonly]),
input[type="number"]:focus:not([readonly]),
input[type="search"]:focus:not([readonly]),
textarea.materialize-textarea:focus:not([readonly]) {
  border-bottom: 1px solid #008df6;
  box-shadow: none;
}

input:not([type]).valid,
input:not([type]):focus.valid,
input[type="text"].valid,
input[type="text"]:focus.valid,
input[type="password"].valid,
input[type="password"]:focus.valid,
input[type="email"].valid,
input[type="email"]:focus.valid,
input[type="url"].valid,
input[type="url"]:focus.valid,
input[type="time"].valid,
input[type="time"]:focus.valid,
input[type="date"].valid,
input[type="date"]:focus.valid,
input[type="datetime"].valid,
input[type="datetime"]:focus.valid,
input[type="datetime-local"].valid,
input[type="datetime-local"]:focus.valid,
input[type="tel"].valid,
input[type="tel"]:focus.valid,
input[type="number"].valid,
input[type="number"]:focus.valid,
input[type="search"].valid,
input[type="search"]:focus.valid,
textarea.materialize-textarea.valid,
textarea.materialize-textarea:focus.valid {
  border-bottom: 1px solid #dcdcdc;
  box-shadow: none;
  margin: 0;
}

.inputDefBox .input-field label {
  top: -12px;
}

.inputDefBox .input-field {
  margin: 0;
}
#modal1 label.active{
  padding:  0 0 8px;
}
#modal1 .rowDivSec label{
  margin:  0 0 12px;
}
.input-field label.active {
  font-size: 0.8rem;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}

.input-field label {
  color: #7a7a7a;
  font-size: 20px;
}

.selectrDefBox .dropdown-content {
  top: 44px !important;
}

.selectrDefBox label {
  font-size: 12px;
}

.selectrDefBox .select-wrapper input.select-dropdown {
  font-size: 20px;
}

.selectrDefBox .dropdown-content li > a,
.selectrDefBox .dropdown-content li > span {
  color: #222;
  padding: 14px 8px;
  font-size: 20px;
}

.select-wrapper span.caret {
  right: 10px;
  font-size: 15px;
  color: #959595;
}

.imageUpload {
  float: left;
  width: 100%;
  margin: 0 15px 10px 0;
}

.imageUpload p {
  /* width:calc(100% - 95px); */
  font-size: 16px;
  line-height: 1.38;
  color: #222222;
  margin: 0;
  padding: 0;
  float: left;
}

.imgBox {
  width: 64px;
  height: 64px;
  float: left;
  border-radius: 1.8px;
  background-color: #fafafa;
  border: solid 0.8px #dcdcdc;
  overflow: hidden;
  cursor: pointer;
  position: relative;
  margin-top: 0px;
  box-shadow: 0 0 3px 0 #DCDCDC;
}
.imgUpdload .uploadText img{
  width: 11px;
  height: auto;
}
.imgBox img {
  width: 80px;
  height: 80px;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
}
.imgBox i {
  text-align: center;
  color: #008df6;
  float: left;
  width: 100%;
  font-size: 16px;
  height: auto;
  margin-top: 13px;
  position: absolute;
  z-index: 1;
  font-weight: bold;
}

.imgBox .icon-attach-2 {
  text-align: center;
  color: #008df6;
  float: left;
  width: 100%;
  font-size: 20px;
  height: auto;
  margin: 6px 0 0 0;
  position: absolute;
  z-index: 1;
  font-weight: bold;
}

.imgBox span {
  width: 100%;
  float: left;
  margin: 32px 0 0 0;
  color: #008DF6;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 20px;
  text-align: center;
}
.seePreviousSec div{
  padding: 8px;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #E62A10;
  background: #F2F2F2;
  border-radius: 4px;
  margin: 12px 0 0;
  float: left;
  width: 100%;
}
.seePreviousSec a{
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  color: #008DF6;
  display: block;
  margin: 8px 0 0;
  clear: both;
  float: left;
}
#seePreviousModal h3{
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
  line-height: 26px;
  text-align: center;
  color: #222222;
  margin: 0;
  padding: 0 0 32px;
}
#seePreviousModal .collapsible-header i{
    margin: 0 20px 0 0;
    width: auto;
    line-height: inherit;
    transform: rotate(90deg);
}
#seePreviousModal .collapsible-header.active i{
  transform: rotate(270deg);
}
#seePreviousModal .modal-close{
  position: absolute;
  right: 16px;

}
#seePreviousModal{
  max-width: 434px;
  overflow-x: auto;
  padding: 24px 8px 24px 12px;
}
#seePreviousModal .collapsible li{
  margin: 0;
  border-bottom: 1px solid #E0E0E0;
}
#seePreviousModal .collapsible li:last-child{
  border: none;
}
.displayContent{
  background: #F6F6F6;
  border-radius: 4px;
  padding: 16px;
  border-bottom: 1px solid #E0E0E0; 
}
.displayContent:last-child{
  border: none;
}
.displayContent p strong{
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #222222;
  padding: 0 0 16px;
}
.displayContent p:first-child{
  padding: 0;
}
#seePreviousModal .collapsible-body{
  border: none;
  padding: 0px 16px 16px;
}
.displayContent p{
  display: flex;
  justify-content: space-between;
  padding: 0 0 8px;
}
#seePreviousModal .collapsible-header{
  display: flex;
  justify-content: space-between;
  min-height: auto;
  padding: 20px;
  border: none;
}
#seePreviousModal .bgHead{
  background: #F6F6F6;
  padding: 24px;
  display: flex;
  justify-content: space-between;
}
#seePreviousModal .collapsible{
  margin: 0;
  max-height: none;
  box-shadow: none;
  border: none;
}
.currentEstimation{
  background: #FFFFFF;
  box-shadow: 0px 4px 8px rgb(0 0 0 / 12%);
  border-radius: 4px;
  clear: both;
  float: left;
  width: 100%;
}
.currentEstimation:last-child{
  margin: 0 0 24px;
}
.displayContent:first-child{
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
}
#seePreviousModal .collapsible small{
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  color: #7A7A7A;
}
#seePreviousModal .collapsible-header span{
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #222222;
  display: flex;
  align-items: center;

}
#seePreviousModal h6{
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  color: #222222;
  padding: 0 0 12px;
  margin: 0;
}
#seePreviousModal h6.historyHead{
  padding: 40px 0 12px;
  clear: both;
}
.seePreviousSec{
  margin: 12px 0 0;
  clear: both;
}
.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .3s ease;
  background: #00000020;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.uploadSec:hover .overlay {
  opacity: 1;
}


.editBox {
  width: 100%;
  float: left;
  clear: both;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.43;
  letter-spacing: 0.5px;
  /* text-align: center; */
  color: #008df6;
  padding: 10px 16px 0 0;
}

.editBox i {
  font-weight: normal;
  padding: 0 7px 0 0;
}

.imptyDivBox {
  width: 100%;
  float: left;
  margin: 68px 0 0 0;
}

.imptyDivBox .imgBoxDiv {
  width: 100%;
  clear: both;
  float: left;
  text-align: center;
}

.imptyDivBox p {
  width: 100%;
  font-size: 20px;
  line-height: 1.3;
  text-align: center;
  float: left;
  color: #222222;
  margin: 16px 0 0 0;
  padding: 0;
}

.overLay {
  width: 100%;
  height: 100%;
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.54);
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
}

.overLayMobile {
  width: 100%;
  height: 100%;
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.54);
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
}

.topText {
  width: auto;
  float: left;
  clear: both;
  font-size: 16px;
  line-height: 1.38;
  text-align: left;
  color: #222222;
  margin: 20px 0 0 16px;
  padding: 0;
}

[type="radio"]:checked + label:after,
[type="radio"].with-gap:checked + label:after {
  background-color: #008df6;
}

[type="radio"]:checked + label:after,
[type="radio"].with-gap:checked + label:before,
[type="radio"].with-gap:checked + label:after {
  border: 2px solid #008df6;
}

.checkBoxList [type="radio"]:not(:checked) + label,
.checkBoxList [type="radio"]:checked + label {
  font-size: 16px;
  line-height: 1.38;
  text-align: left;
  color: #7a7a7a;
}

[type="radio"]:not(:checked) + label:before,
[type="radio"]:not(:checked) + label:after {
  border: 2px solid #7a7a7a;
}

.row-bounds {
  width: calc(100% - 8px);
  padding: 17px 16px;
  border-radius: 2px;
  background-color: #f6f6f6;
  margin: 0 4px;
  font-size: 16px;
  line-height: 1.38;
  text-align: left;
  color: #222222;
  float: left;
}

.row-bounds i {
  float: right;
}

.optionSecBox {
  width: 100%;
  float: left;
  padding: 0 0 0 16px;
  border: none;
  display: block;
}

.optionSecBox .checkBoxList {
  margin: 30px 0;
  width: 100%;
  clear: both;
}

.searchBoxTextDiv {
  border-radius: 2px;
  border: solid 1px #dcdcdc;
  margin: -2px 0 0 16px;
  padding: 0;
  font-size: 14px;
  line-height: 1.1;
  text-align: left;
  color: #212121;
  padding: 4px 8px 4px 8px;
  float: left;
}

.searchBoxTextDiv i {
  margin: 0 0 0 5px;
  cursor: pointer;
}

.tostDiv {
  width: 100%;
  clear: both;
  border-radius: 2px;
  background-color: rgba(50, 50, 50, 0.87);
  box-shadow: 0 6px 6px 0 rgba(0, 0, 0, 0.24), 0 0 6px 0 rgba(0, 0, 0, 0.12);
  border-style: solid;
  border-width: 1px;
  border-image-source: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.2),
    rgba(255, 255, 255, 0.1) 5%,
    rgba(255, 255, 255, 0) 20%,
    rgba(255, 255, 255, 0)
  );
  border-image-slice: 1;
  font-size: 16px;
  line-height: 1.38;
  text-align: center;
  color: #ffffff;
  padding: 14px 0;
  margin: 0 0 18px 0;
}

.imageUploadRightSec {
  /* float: right; */
  width: auto;
}

.last-uploaded {
  width: 100%;
  font-size: 14px;
  line-height: 1.43;
  color: #7a7a7a;
  margin: 8px 0 0 0;
  float: left;
}
.invoiceCheckTabs ul{
  display: flex;
  margin: 0;
}
.invoiceCheckTabs li {
  min-width: 136px;
  background: #F1F2F3;
  border-radius: 2px;
  text-align: center;
  margin: 0 8px 0 0;
  padding: 5px 16px;
  font-weight: 500;
  font-size: 12px;
  line-height: 20px;
  text-transform: capitalize;
  color: #222222;
  cursor: pointer;
}
.invoiceCheckTabs{
  clear: both;
  margin: 8px 0 8px 24px;
}
.invoiceCheckTabs li:last-child{
  margin: 0;
}
.invoiceCheckTabs li.active{
  background: #0282F0;
  color: #fff;
}

.uploadSection{
  clear: both;
}
.sos04 .menuMoblie,
.sos004 .menuMoblie {
  display: none;
  float: right;
  width: 4px;
  height: 16px;
  padding: 0 10px;
  margin: 10px 0 0 0;
  background: url(../images/menuDot.png?1780752732463) center top no-repeat;
}

.uploadInvoice {
  background-color: #ffffff;
  width: 100%;
  position: absolute;
  float: left;
  height: calc(100% - 65px);
  min-height: calc(100% - 65px);
  overflow: hidden;
  margin: 65px 0 0 0;
}

.uploadInvoice img {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  position: absolute;
}

.mobileSearchOpt {
  background-color: #ffffff;
  width: 100%;
  position: relative;
  float: left;
}

.serviceHeading {
  width: 100%;
  float: left;
  background: #012b72;
  height: 65px;
  padding: 15px;
  color: #fff;
  font-size: 20px;
  /*position: fixed;*/
  z-index: 1;
}
.serviceHeading i {
  color: #fff;
  margin: 0 30px 0 0;
  float: left;
}

.serviceHeading span {
  width: 150px;
  text-overflow: ellipsis;
  overflow: hidden;
  float: left;
  white-space: nowrap;
}

.mobileFormSec {
  width: 100%;
  float: left;
  padding-bottom: 90px;
}

.mobileFormSec .collapsible {
  border: none;
  margin: 0;
}

.mobileFormSec .collapsible-header {
  display: block;
  cursor: pointer;
  min-height: auto;
  line-height: auto;
  border-bottom: none;
  width: calc(100% - 8px);
  padding: 17px 16px;
  border-radius: 2px;
  background-color: #f6f6f6;
  margin: 4px;
  font-size: 16px;
  line-height: 1.38;
  text-align: left;
  color: #222222;
  float: left;
}

.mobileFormSec .collapsible-header i {
  width: auto;
  font-size: 16px;
  line-height: 22px;
  display: block;
  float: right;
  text-align: center;
  margin-right: 0;
}

.checkBoxList .input-field {
  margin: 8px 0 0 35px;
}

.uperDropDown {
  border-radius: 2px;
  min-width: 175px;
  background-color: #fafafa;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12);
  border-style: solid;
  border-width: 1px;
  border-image-source: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.2),
    rgba(255, 255, 255, 0.1) 5%,
    rgba(255, 255, 255, 0) 20%,
    rgba(255, 255, 255, 0)
  );
  border-image-slice: 1;
}

.uperDropDown li a {
  font-size: 16px;
  line-height: 1.38;
  text-align: left;
  color: #222222;
  width: 100%;
  white-space: nowrap;
  padding: 13px 16px;
}

.oval {
  width: 7px;
  right: -2px;
  top: -2px;
  height: 7px;
  background-color: #008df6;
  border-radius: 50%;
  position: absolute;
}

.editBoxTop {
  width: auto;
  float: right;
  font-size: 14px;
  font-weight: normal;
  margin: 8px 0 0 0;
}

.editBoxTop i {
  margin: 0 10px 0 0;
}

.sheet-bg {
  width: 100%;
  position: fixed;
  z-index: 3;
  bottom: 0;
  background-color: #fafafa;
  border-style: solid;
  border-width: 1px;
  border-image-source: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.8),
    rgba(255, 255, 255, 0.4) 5%,
    rgba(255, 255, 255, 0) 20%,
    rgba(255, 255, 255, 0)
  );
  border-image-slice: 1;
  padding: 20px;
}

.invoiceUploadMobile {
  width: 100%;
  font-size: 10px;
  font-weight: bold;
  line-height: 1;
  letter-spacing: 1px;
  color: #7a7a7a;
  float: left;
}

.mobilePicSec {
  float: left;
  width: 100%;
  margin: 13px 0 0 0;
  padding: 0;
}

.mobilePicSec li {
  float: left;
  width: 100%;
  margin: 10px 0;
  padding: 0;
}

.mobilePicSec li i {
  float: left;
  width: auto;
  font-size: 20px;
  margin: -5px 19px 0 0;
}

.mobilePicSec li span {
  float: left;
  width: auto;
  font-size: 16px;
  line-height: 1.5;
  color: rgba(0, 0, 0, 0.54);
}

.durationDiv {
  float: left;
  width: 100%;
  clear: both;
  padding: 0 35px;
}
.toDiv {
  width: calc(50% - 30px);
  float: left;
}

.sepDiv {
  width: 60px;
  float: left;
  font-size: 18px;
  text-align: center;
  margin: 30px 0 10px 0;
}

.fromDiv {
  width: calc(50% - 30px);
  float: right;
}

.checkBoxList .toDiv .input-field,
.checkBoxList .fromDiv .input-field {
  margin: 8px 0 0 0;
}

.picker__weekday-display {
  background-color: #0179d3;
}

.picker__date-display {
  background-color: #008df6;
  font-weight: normal;
}

.picker__day.picker__day--today,
.picker__close,
.picker__today {
  color: #008df6;
}

.picker__year-display {
  color: #fff;
}

.pointer {
  cursor: pointer;
}

.redColor {
  color: red;
  width: 100%;
  float: left;
  margin: 2px 0 5px 0;
  font-size: 12px;
}

#modalError p {
  word-wrap: break-word;
}

.otpPopup {
  max-width: 280px;
  background: #fff;
  margin: 0 auto;
  text-align: center;
  overflow: hidden;
  border-radius: 0px;
}
#otpstartmodal{
  overflow: revert;
}
.otpPopup h2 {
  color: #222;
  font-size: 20px;
  font-weight: 400;
}

.otpPopup p {
  color: #888;
  padding: 0;
  margin: 15px 0 0 0;
}

.otpPopup .add {
  border-left: none;
  float: none;
  border-radius: 0;
}

.padd25 {
  padding: 25px 25px 40px 25px;
}

.fullWidth {
  width: 100% !important;
}

.main-loader {
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: white;
  background-color: rgba(255, 255, 255, 0.5);
  z-index: 2000;
}

form {
  background-color: #fff;
}

.selectrDefBox {
  float: left;
  width: 100%;
  height: 86px;
}

.inputDefBox {
  float: left;
  width: 100%;
  height: 72px;
}

.helpText {
  color: rgba(0, 0, 0, 0.26);
  padding: 4px 0 0 0;
  font-size: 0.8rem;
}

.filterSlideSec .collapsible {
  border: none;
  margin: 0;
}

.filterSlideSec .collapsible-header {
  display: block;
  cursor: pointer;
  min-height: auto;
  line-height: auto;
  border-bottom: none;
  width: calc(100% - 8px);
  padding: 17px 16px;
  border-radius: 2px;
  background-color: #f6f6f6;
  margin: 4px;
  font-size: 16px;
  line-height: 1.38;
  text-align: left;
  color: #222222;
  float: left;
}

.filterSlideSec .collapsible-header i {
  width: auto;
  font-size: 16px;
  line-height: 22px;
  display: block;
  float: right;
  text-align: center;
  margin-right: 0;
}

.a {
  width: 65%;
  float: left;
  word-wrap: break-word;
}

.tableSrnViewFull {
  width: 100%;
}

.picker__box {
  border: none;
  border-radius: 0;
  box-shadow: none;
}

.errorMsg {
  font-size: 12px;
  color: #ff3e00;
  margin: 5px 0 0 0;
  float: left;
  clear: both;
  width: 100%;
}

.dateFont {
  font-size: 12px !important;
}

.switch label .lever:after {
  width: 21px;
  height: 21px;
  top: 0;

  box-shadow: none;
}

.switch label input[type="checkbox"]:checked + .lever:after {
  background-color: #008df6;
  top: 0;
}

.switch label input[type="checkbox"]:checked + .lever {
  background-color: #bfe4ff;
  height: 21px;
}

.switch label .lever {
  margin: 0 8px;

  height: 21px;
}

.switch {
  float: right;
  width: auto;
  margin: 10px 15px 0 0;
}

.switch label {
  font-size: 14px;
}

.subTextBox {
  width: auto;
  float: left;
  margin: 8px 0 26px 0;
}
/* pagination starts*/

.paginationBoxDiv {
  float: right;
  clear: both;
  font-size: 14px;
  text-align: center;
  margin: 5px 0 16px 0;
}

.ul-class {
  background-color: #ffffff;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12);
  font-size: 14px;
  line-height: 1.43;
  overflow: hidden;
  color: #7a7a7a;
  float: left;
  width: auto;
  border-radius: 3px;
}

.ul-class ul {
  float: left;
  width: auto;
  padding: 0;
  margin: 0;
}

.ul-class ul li {
  float: left;
  width: auto;
  padding: 0;
  margin: 0;
}

.ul-class ul li a {
  color: #7a7a7a;
  padding: 8px 13px;
  float: left;
  text-align: center;
  border: solid 1px #fff;
}

.ul-class ul li a:hover {
  color: #008df6;
  border: solid 1px #008df6;
}

.next-class {
  float: right;
  width: auto;
  border-left: solid 1px #dcdcdc;
}

.prev-class {
  float: left;
  width: auto;
  border-right: solid 1px #dcdcdc;
}

.next-class i,
.prev-class i {
  float: left;
  padding: 8px 12px;
  width: auto;
  cursor: pointer;
  color: #008df6;
}

.icon-right-dir:before {
  content: "\e8d2";
}

.icon-left-dir:before {
  content: "\e8d3";
}

.pageBoxDiv {
  float: left;
  width: auto;
}

/* pagination End */

.allDetails {
  width: 100%;
  float: left;
  clear: both;
  padding: 0;
  margin: 0;
  padding-bottom: 20px;
}

.allDetails li {
  width: 100%;
  float: left;
  clear: both;
  border-bottom: solid 2px #dcdcdc;
  padding: 15px 16px;
  margin: 0;
}

.allDetails li .leftSectTextBox {
  width: 40%;
  float: left;
  font-size: 10px;
  font-weight: bold;
  line-height: 1.9;
  letter-spacing: 1px;
  text-align: left;
  color: #7a7a7a;
  text-transform: uppercase;
}

.allDetails li .rightSectTextBox {
  width: 60%;
  float: left;
  font-size: 14px;
  line-height: 1.43;
  text-align: left;
  color: #212121;
}

.btn100 {
  width: 100%;
  margin: 0;
  text-align: center;
  color: #fff;
  box-shadow: none;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 2px;
  z-index: 0;
  border: none;
  border-radius: 2px;
  height: 50px;
  line-height: 50px;
}

.actionBoxMobileNotShadow {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 20px 4px;
  background: #fff;
}

.bluePach {
  background: #012b72;
  width: 100%;
  height: 80px;
}

.side-nav a {
  color: #000;
  display: block;
  font-weight: 400;
  font-size: 16px;
  height: 60px;
  line-height: 60px;
  background: url(../images/rightArrow.png?1780752732463) no-repeat 270px center;
}

.side-nav a img {
  float: left;
  margin: 10px 10px 0 0;
}

.side-nav a span {
  float: left;
  width: auto;
}

.divider {
  height: 1px;
  overflow: hidden;
  background-color: #e0e0e0;
}

.sizing {
  font-size: 14.6px;
  margin-right: 5px;
}

.side-nav .divider {
  margin: 0;
}

.bluePach .profileIcon {
  display: none;
}

.profileIcon {
  float: left;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  overflow: hidden;
}

.bluePach p {
  display: none;
}

.active-class {
  background: #ccc;
}

.modelBoxDiv {
  width: 360px;
  height: 500px;
  overflow: hidden;
}

.modal .imgBox {
  width: 360px;
  height: 500px;
  position: relative;
}

.modal .imgBox img {
  width: 100%;
  height: 100%;
  position: absolute;
  border-radius: 3px;
}

.closePopup {
  position: absolute;
  z-index: 1;
  width: 28px;
  height: 27px;
  top: 5px;
  right: 5px;
}

.arrowClick {
  float: right;
  width: 20px;
  height: 20px;
  font-size: 20px;
  text-align: right;
  color: #a9a9a9;
  line-height: 1;
  margin: 9px 0 0 0;
  cursor: pointer;
}

.userDetails {
  float: left;
  width: calc(100% - 30px);
}

.autoComp {
  width: calc(100% - 32px);
  margin: 24px 16px;
}

.yesNoWidth {
  width: 104px;

}
.gstNo{
  display: block;
}
.addSpr p{
  color: #222222;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 20px;
  display: block;
  cursor: auto;
  margin: 0 0 16px;
}
.addSpr .addBtn{
  color: #008DF6; 
}
.addSpr a{
  float: right;
  cursor: pointer;
  color: #008DF6;
  display: inline;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 20px;
  display: inline-block;
  width: auto;
    margin: 0;
}
.tooltip {
  position: relative;
  display: inline-block;
  cursor: pointer;
}
.flexType li{
  display: inline-block;
  width: 36%;
}
.uploadNew a{
  cursor: pointer;
  color: #008DF6;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 20px;
}

.uploadNew a img{
  vertical-align: middle;
  display: inline-block;
  margin: 0 8px 0 0;
  width: 16px;
}
.flexType{
  width: 100%;
  margin: 0;
  position: relative;
  clear: both;
  padding: 12px 0 8px;
}
.uploadText{
  text-align: center;
}
.uploadText p{
  color: #008DF6 !important;
  font-size: 14px !important;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 20px;
  text-align: center;
}
.estimateText{
  color: #222222;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 20px;
}
.toolTipbox{
  color: #7A7A7A;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 20px;
  text-align: right;
  display: inline-block;
  vertical-align: text-bottom;
}
.toolTipbox img{
  margin: 0 0 0 8px;
  vertical-align: middle;
  width: 16px;
}
.imgUpdload img.downloadIcon {
  width: 24px;
  height: auto;
}
.deviceImgsec h6{
  color: #222222;
  font-weight: normal;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 20px;
  padding:  20px 0 12px;
}
.autocomplete-content{
    z-index: 1;
    display: block;
    background: #fff;
    position: relative;
    overflow-y: auto;
    max-height: 250px;
}
.dropdown-content li>span{
  color: #008df6;
}
.uploadSec{
  display: flex;
}

#modal1 .input-field label.active{
  top: 16px;
}
.partsDetails .tooltip .tooltiptext{
  padding: 5px 8px;
  max-width: 67px;
  clear: both;
  height: auto;
  padding: 0;
  box-sizing: border-box;
  text-align: center;
}
#modal1 .input-field label.active{
  color: #7A7A7A;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 20px;
}
.imgUpdload{
  height: 64px;
  cursor: pointer;
  width: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 1.8px;
  background-color: #FAFAFA;
  margin: 0 12px 12px 0;
  position: relative;
  box-shadow: 0 0 3px 0 #DCDCDC;
  border: 0.98px solid #DCDCDC;
}
.deviceImgsec ul li:last-child .imgUpdload{
  margin: 0;
  
}
.deviceImgsec ul{width: 100%;margin: 0 0 30px;}
.deviceImgsec ul li{
  display: inline-block;
  vertical-align: text-top;
}
.imgUpdload span i{
  color: #fff;
  font-size: 12px;
  margin: 0;
  vertical-align: baseline;
}
.imgUpdload span{
  z-index: 9;
  cursor: pointer;
}
.absDiv{
  position: absolute;
  right: -6px;
  top: -9px;
}
.imgUpdload img.remove{
  width: 16px;
  height: auto;
}
.flexType li:first-child{
  width: 62%;
}
.reuploadInvoice .uploadNew p{
  color: #222222;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 20px;
  padding: 12px 0 8px;
}
.imgUpdload i{
  color: #008DF6;
  font-size: 18px;
}
.absDiv .tooltip .tooltiptext {
    padding: 5px 8px;
    max-width: 67px;
    clear: both;
    height: auto;
    padding: 0;
    box-sizing: border-box;
}
.absDiv .tooltip .tooltiptext{
  top: 117%;
  text-align: center;
}
.absDiv .tooltip .tooltiptext::after{
  left: 86%;
}
.imgUpdload img{
  width: 100%;
  height: -webkit-fill-available;
}
.imgUpdload img.reUpload{
  margin: 0;
}
.uploadText i{
  color: #008DF6;
  font-size: 18px;
}
.tooltip .tooltiptext {
  display: none;
  width: 215px;
  background: #fff;
  color: #454545;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 24px;
  position: absolute;
  z-index: 1;
  top: 150%;
  right: 0;
  box-shadow: 0 2px 6px 0 rgba(0,0,0,0.24);
  padding: 8px;
  border-radius: 2px;
  text-align: left;
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 96%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent #fff transparent;
}

.tooltip:hover .tooltiptext {
  display: block;
}
.onoffBtn {
  float: right;
  padding: 0; margin: 0;

}

.onoffBtn li {
  text-align: center;
  width: 50%;
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  float: left;
}

.onoffBtn li a {
  cursor: pointer;
  float: left;
  width: 100%;
  float: left;
  padding: 8px 0 6px 0;
  line-height: 10px;
  color: #222;
  border: solid 1px #222;
}

.onoffBtn li a.active {
  color: #fff;
  background: #008df6;
  border: none;
  border: solid 1px #008df6;
}

input:-webkit-autofill {
  -webkit-box-shadow: 0 0 1px 1000px #fff inset !important;
}
.yesCondition {
  width: 100%;
  height: 450px;
  overflow-x: hidden;
  overflow-y: scroll;
  padding: 7px 0 70px 0;
}

.mobileFileUploaderCls {
  display: none;
}

.picker__today {
  display: none;
}

@-moz-document url-prefix() {
  .yesCondition {
    width: 100%;
    height: 350px;
    overflow-x: hidden;
    overflow-y: scroll;
    padding: 7px 0 70px 0;
  }
}

.selectDeviceBox {
  max-width: 400px;
  background: #fff;
  border-radius: 3px;
  padding: 16px;
  float: left;
  overflow-y: inherit;
}

.selectDeviceBox .modal-content {
  padding: 0;
}

.selectDeviceBox h1 {
  font-size: 20px;
  line-height: 1.3;
  width: 100%;
  clear: both;
  color: #222222;
  font-weight: normal;
  text-align: center;
  margin: 10px 0 0 0;
}

.selectDeviceBox [type="checkbox"] + label {
  font-size: 16px;
  color: #222222;
  font-weight: normal;
  line-height: 19px;
}
.selectDeviceBox [type="checkbox"].filled-in:not(:checked) + label:after {
  border: 2px solid #9a9a9a;
  width: 18px;
  height: 18px;
}

.selectDeviceBox [type="checkbox"] + label:before,
.selectDeviceBox [type="checkbox"]:not(.filled-in) + label:after {
  width: 18px;
  height: 18px;
}
.selectDeviceBox [type="checkbox"].filled-in:checked + label:after {
  width: 18px;
  height: 18px;
}

.selectDeviceBox .input-field {
  position: relative;
  margin: 16px 0 0 36px;
  width: calc(100% - 20px);
  height: 50px;
}
.component-field {
  width: calc(100% - 40px) !important;
}
.selectDeviceBox ul {
  float: left;
  width: 100%;
  clear: both;
  margin: 20px 0 10px 0;
  padding: 0;
  max-height: 300px;
  overflow: auto;
  overflow-x: hidden;
}
.selectDeviceBox ul li {
  float: left;
  width: 100%;
  clear: both;
  margin: 6px 0;
  padding: 0;
}

.selectSerCen {
  box-sizing: border-box;
  height: auto;
  width: 411px;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  background-color: #fafafa;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.24);
  padding: 16px;
}

.selectSerCen h1 {
  width: 100%;
  color: #212121;
  font-size: 18px;
  font-weight: 500;
  line-height: 28px;
  text-align: center;
  margin: 0 0 38px 0;
}

.selectSerCen ul {
  float: left;
  width: 100%;
  clear: both;
  margin: 20px 0 10px 0;
  padding: 0;
  max-height: 200px;
  overflow: auto;
  overflow-x: hidden;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.12), 0 4px 4px 0 rgba(0, 0, 0, 0.24),
    0 0 24px 0 rgba(0, 0, 0, 0.12), 0 24px 24px 0 rgba(0, 0, 0, 0.24);
}
.selectSerCen ul li {
  float: left;
  width: 100%;
  clear: both;
  margin: 0;
  padding: 0;
  min-height: auto;
  height: auto;
  line-height: normal;
}

.selectSerCen .dropdown-content {
  top: 27px !important;
}

.selectSerCen .dropdown-content li > a,
.selectSerCen .dropdown-content li > span,
.selectSerCen .dropdown-content input {
  color: #212121;
  font-size: 14px;
  line-height: normal;
  padding: 12px 15px;
}

.selectSerCen .select-wrapper input.select-dropdown {
  font-size: 14px !important;
}

.addBtnPopup {
  width: 100%;
  margin: 0;
  box-shadow: none;
  float: left;
  height: auto;
  line-height: 20px;
  padding: 16px 0;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 2px;
  z-index: 0;
  background: #008df6;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0;
}

.modalCloseBtn {
  background: url(../images/close.png?1780752732463) no-repeat 0 0;
  width: 28px;
  height: 28px;
  position: absolute;
  right: -10px;
  top: -10px;
  cursor: pointer;
}

::-webkit-scrollbar {
  width: 5px;
}
::-webkit-scrollbar-track {
  background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
  background: #888;
}
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

.addSpr {
  float: left;
  width: 100%;
  clear: both;
}
.addParts {
  width: 100%;
  float: left;
  font-size: 15px;
  color: #008df6;
  margin: 0 0 25px 0;
}
.addParts i {
  font-size: 26px;
  float: right;
  margin: -8px 0 0 0;
}

.headSec {
  float: left;
  width: 100%;
  margin: 0 16px 0 0;
}

.headSec .leftHeading {
  float: left;
  width: 70%;
  font-size: 10px;
  font-weight: bold;
  font-style: normal;
  font-stretch: normal;
  line-height: 1;
  letter-spacing: 1px;
  color: #7a7a7a;
  text-transform: uppercase;
}
.headSec .leftHeading2{
  color: #222222;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 1.5;
  text-transform: capitalize;
  font-weight: normal;
}
.partsDetails{
  border: none;
  box-shadow: none;
  padding: 10px 0 0;
}
.partsDetails .collapsible-header i{
  line-height: inherit;
  color: #959595;
  font-size: 24px;
  margin-right: 12px;
  width: auto;
  float: left;
  text-align: left;
}

.partsName .hsnId {
  display: inline-block; 
  width: auto !important;
  float: none !important;
  font-size: 14px  !important;
  color: #222222  !important;
}
.partsDetails li .partsName{
  background: #F6F6F6;
  color: #222222;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 24px;
  float: left;
  width: 70%;
  min-height: auto;
  padding: 10px 8px;
  border: none;
}
.partsDetails li{
  border-radius: 4px;
  background: #F6F6F6;
  margin: 0 0 4px;
}
.headSec .rightHeading {
  float: left;
  width: 30%;
  font-size: 14px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.43;
  letter-spacing: normal;
  text-align: right;
  color: #008df6;
}

.partsDetails {
  float: left;
  width: 100%;
  margin: 5px 0 10px 0;
}
.partsDetails li {
  float: left;
  width: 100%;
  margin: 0 0 4px;
  align-items: center;
  padding: 10px 8px;
}
.partsDetails li.active{
  display: block;
}
.partsDetails .collapsible-body li{
  display: flex;
  align-items: center;
  padding: 6px 8px;
  margin: 0;
  color: #7A7A7A;
  font-size: 12px;
  letter-spacing: 0;
  line-height: 16px;
}

.partsDetails .collapsible-body li span{
  width: 50%;
  display: inline-block;
}
.partsDetails .collapsible-body li span:last-child{
  text-align: right;
}
.partsDetails li .partsName{
 padding: 0;
}
.partsDetails .displayFlex li div{
  width: 50%;
  padding: 0;
}
.partsPrice i{
  color: #959595;
  display: inline-block;
  margin: 0 0 0 4px;
}
.savedComponents .collapsible-body{
  border: none;
}
.partsDetails .savedComponents .collapsible-body li span{
  width: 50%;
}
.partsDetails .savedComponents .collapsible-body li span:last-child{
  display: inline-block;
  text-align: right;
}
.partsDetails li .partsName span {
  float: left;
  width: 100%;
  font-size: 12px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.8;
  letter-spacing: normal;
  color: #757575;
  clear: both;
}
.partsDetails .collapsible-body li{
  padding: 10px 0px;
}
.partsDetails .collapsible-body{
  border: none;
}
.partsDetails li .partsPrice {
  float: left;
  width: 30%;
  font-size: 16px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.63;
  letter-spacing: normal;
  color: #222222;
  text-align: right;
  background: #f6f6f6;
}
.partsDetails .savedComponents li .partsPrice {
  width: auto;
}
.partsDetails li .partsPrice i {
  color: #959595;
  cursor: pointer;
}

.approve {
  color: #757575 !important;
  text-decoration: line-through;
}

.reuploadInvoice {
  float: left;
  width: 100%;
  clear: both;
  margin: 10px 0 0 0;
}
.reuploadInvoice p {
  width: 100%;
  font-size: 16px;
  line-height: 1.38;
  color: #222222;
  margin: 0;
  padding: 0;
  float: left;
  left: bo;
}
.invoiceUpload {
  float: left;
  width: 100%;
  margin: 15px 0 0 0;
}
.invoiceUpload dl {
  float: left;
  width: 100%;
  margin: 0;
  position: 0;
}
.invoiceUpload dl dt {
  float: left;
  width: 50%;
  margin: 0;
  padding: 0 10px 0 0;
}
.invoiceUpload dl dt font {
  float: left;
  width: 100%;
  font-size: 12px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.5;
  letter-spacing: normal;
  color: #757575;
  margin: 8px 0 0 0;
}

.textBoxSec {
  font-size: 16px;
  line-height: 1.38;
  width: auto;
  float: left;
  color: #222222;
  margin: 8px 0 0 0;
  float: left;
  width: 100%;
}

.notificationSecList {
  float: left;
  width: calc(100% + 16px);
  margin: 10px 0 0 -16px;
}
.notificationSecList li {
  float: left;
  width: 100%;
  background: #fffde7;
  margin: 2px 0 0 0;
  padding: 0 16px 16px 16px;
}
.notiIcon {
  width: 36px;
  height: 36px;
  background-color: #757575;
  float: left;
  position: relative;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.57;
  letter-spacing: normal;
  color: #ffffff;
  border-radius: 50%;
  margin: 17px 0 0 0;
  text-align: center;
  padding: 7px 0 0 0;
  font-size: 15px;
}

.notiIcon .redSig {
  width: 12px;
  height: 12px;
  background-color: #e62a10;
  border: solid 1px #ffffff;
  position: absolute;
  right: -1px;
  top: -1px;
  border-radius: 50%;
}

.contBoxSec {
  float: left;
  width: calc(100% - 70px);
  margin: 16px 0 0 12px;
}

.contBoxSec p {
  float: left;
  width: 100%;
  font-weight: 600;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.43;
  letter-spacing: normal;
  color: #212121;
  clear: both;
  padding: 0;
  margin: 0;
  font-size: 14px;
}
.contBoxSec span {
  float: left;
  width: 260px;
  font-size: 14px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.43;
  letter-spacing: normal;
  color: #212121;
  margin: 4px 0 0 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.notificationSecList li i {
  width: 20px;
  height: 20px;
  float: left;
  text-align: center;
  margin: 13px 0 0 0;
  cursor: pointer;
  font-weight: bold;
}

.headerNotification {
  width: 32px;
  cursor: pointer;
  height: 32px;
  background-color: #fafafa;
  border: solid 1px #dcdcdc;
  float: right;
  border-radius: 50%;
  margin: 21px 24px 0 0;
  position: relative;
  color: #0a090b;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  padding: 3px 0 0 3px;
}

.headerNotification span {
  width: 8px;
  height: 8px;
  background-color: #e62a10;
  position: absolute;
  border-radius: 50%;
  margin: 3px 0 0 -8px !important;
  border: solid 1px #fff;
}

.combinedShape {
  width: 376px;
  right: 0px;
  position: absolute;
  top: 60px;
  display: none;
  background-color: #ffffff;
  border: solid 1px #e0e0e0;
  z-index: 9999;

  -webkit-user-select: none; /* webkit (safari, chrome) browsers */
  -moz-user-select: none; /* mozilla browsers */
  -khtml-user-select: none; /* webkit (konqueror) browsers */
  -ms-user-select: none; /* IE10+ */
}
.discharge-device-text {
  margin-bottom: 20px;
}

.arrow_box {
  background: #fff;
  border: 1px solid #fff;
  width: 5px;
  left: 80px;
  position: absolute;
  top: -1px;
}

.arrow_box:after,
.arrow_box:before {
  bottom: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.arrow_box:after {
  border-color: rgba(255, 255, 255, 0);
  border-bottom-color: #fff;
  border-width: 5px;
  margin-left: -5px;
}
.arrow_box:before {
  border-color: rgba(224, 224, 224, 0);
  border-bottom-color: #e0e0e0;
  border-width: 6px;
  margin-left: -6px;
}
.headerNotiList {
  margin: 0;
  max-height: 342px;
  background-color: #ffffff;
  border: none;
  overflow-x: hidden;
  overflow-y: scroll;
  box-shadow: 0px 0px 8px 0px #8a8a8a;
}

.headerNotiList dt {
  float: left;
  width: 100%;
  padding: 13px 20px;
  margin: 0;
  background: #fff;
  cursor: pointer;
}
.headerNotiList dt:hover {
  background: #fffde7;
}
.headerNotiList dt .notiIcon {
  margin: 0 !important;
}
.contBox {
  float: left;
  width: calc(100% - 70px);
  margin: 0 0 0 12px;
  text-align: left;
}
.contBox h6 {
  float: left;
  width: 100%;
  font-weight: 600;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.43;
  letter-spacing: normal;
  color: #212121;
  clear: both;
  padding: 0;
  margin: 0;
  font-size: 14px;
}

.contBox p {
  float: left;
  width: 100%;
  font-size: 14px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.43;
  letter-spacing: normal;
  color: #212121;
  margin: 4px 0 0 0;
}

.contBox font {
  float: left;
  width: 100%;
  font-size: 12px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.5;
  letter-spacing: normal;
  color: #757575;
  margin: 8px 0 0 0;
}
.serviceId,
.new {
  float: left;
  width: 100%;
  clear: both;
}
.new {
  font-size: 12px;
  color: #e62a10;
  list-style: circle;
  background: url(../images/redBull.png?1780752732463) no-repeat left center;
  padding: 0 0 0 15px;
  line-height: 15px;
}

.redBull {
  background: url(../images/redBull.png?1780752732463) no-repeat 16px center;
  padding-left: 30px !important;
}

.mobileNotification {
  float: right;
  width: auto;
  display: none;
  position: relative;
}
.mobileNotification i {
  float: left;
  font-size: 17px;
  margin: 5px 0 0 20px;
  cursor: pointer;
}
.mobileNotification span {
  width: 8px;
  height: 8px;
  background-color: #e62a10;
  border: solid 1px #ffffff;
  position: absolute;
  top: 25px;
  right: 0;
  border-radius: 50%;
}

.combinedShape.open {
  display: block;
}

i.notification-button.icon-cancel-1 {
  z-index: 1;
  position: relative;
}
.paginationBoxDiv {
  position: relative;
}
.pageSizePopup {
  position: absolute;
  background: #fff;
  bottom: 110%;
  width: 190px;
  padding: 10px;
  font-size: 12px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12);
}
.icon-cog:before {
  content: "\e8a3";
}
.pageSizeDiv i {
  color: #008df6;
  font-size: 20px;
}

.ul-class.pageSizeDiv ul li a {
  padding: 4px 10px;
}

.inputRow {
  padding: 6px 12px;
  text-align: left;
}

.pageSizeDiv .title {
  font-weight: bold;
  color: #212121;
}

ul.checkFilBox {
  float: left;
  width: 100%;
  padding: 0;
  margin: 0;
}
ul.checkFilBox .checkboxDiv {
  float: left;
  width: 100%;
  margin: 0 0 20px 0;
  padding: 0 16px;
}
.checkboxDiv label {
  color: #222222;
  font-size: 16px;
  line-height: 22px;
}

.grayTag {
  border-radius: 0 0 2px 0;
  background-color: #7a7a7a;
  font-size: 12px;
  line-height: 14px;
  padding: 2px 8px;
  position: absolute;
  top: -1px;
  left: -1px;
  color: #fff;
}
.statusSecDiv {
  float: left;
  width: 100%;
  background-color: #f6f6f6;
  padding: 16px;
}
.statusSecDiv span.pending {
  float: left;
  width: auto;
  border: 1px solid #ff9800;
  border-radius: 2px;
  padding: 3px 12px;
  color: #fb9b00;
  font-size: 10px;
  font-weight: 500;
  line-height: 10px;
  clear: both;
}
.statusSecDiv h6 {
  float: left;
  width: auto;
  clear: both;
  margin: 8px 0 0 0;
  color: #7a7a7a;
  font-size: 12px;
  line-height: 18px;
}
.statusSecDiv p {
  float: left;
  clear: both;
  width: auto;
  margin: 8px 0 0 0;
  color: #212121;
  font-size: 14px;
  line-height: 20px;
}

.detailSec {
  float: left;
  width: 100%;
  clear: both;
  background: #fff;
}
.detailSec ul {
  float: left;
  width: 100%;
  clear: both;
  margin: 0;
  padding: 0;
}
.detailSec ul li {
  float: left;
  width: 100%;
  border-bottom: solid 1px #dcdcdc;
  padding: 15px 16px;
}
.detailSec ul li .leftSec {
  float: left;
  width: 40%;
  color: #7a7a7a;
  font-size: 10px;
  font-weight: bold;
  letter-spacing: 1px;
  line-height: 10px;
  text-transform: uppercase;
  padding: 5px 0 0 0;
}
.detailSec ul li .rightSec {
  float: left;
  width: 60%;
  color: #212121;
  font-size: 14px;
  line-height: 20px;
}

.detailSec .checkBoxSec {
  float: left;
  width: 100%;
  padding: 19px 16px;
}
.detailSec .checkBoxSec label {
  color: #212121;
  font-size: 12px;
  line-height: 20px;
}
.detailSec
  .checkBoxSec
  [type="checkbox"].filled-in:not(:checked)
  + label:after {
  height: 18px;
  width: 18px;
}
.detailSec .checkBoxSec [type="checkbox"].filled-in:checked + label:after {
  width: 18px;
  height: 18px;
}
.detailSec .checkBoxSec [type="checkbox"] + label {
  padding-left: 30px;
}
.detailSec .actionSec {
  float: left;
  width: 100%;
  padding: 0 8px;
}
.pendingCom{
  display: flex;
  width: 100%;
  float: none;
  margin: 0;
  padding: 16px 16px 28px !important;
}
.pendingCom li{
  width: 100%;
  margin: 0 16px 0 0;
}
.pendingCom li:last-child{
  margin: 0;
}
.btnBgBlue {
  background: #008df6;
}
.detailSec .actionSec button:focus {
  outline: none;
  background-color: #008df6;
}
.detailSec .actionSec button:disabled {
  background-color: #dcdcdc;
}

.tabCnt {
  float: left;
  width: 100%;
  margin: 20px 0 10px 0;
  padding: 0 16px;
}
.tabCnt span.ber {
  float: left;
  width: auto;
  background-color: #7a7a7a;
  padding: 2px 8px;
  color: #ffffff;
  font-size: 12px;
  line-height: 14px;
  border-radius: 2px;
}

.pos-rel {
  position: relative;
}

.top-bar-icons {
  display: inline-flex;
  float: right;
  margin-right: 20px;
}

.top-bar-icons i {
  font-size: 17px;
  padding: 7px 12px;
  cursor: pointer;
}

.newMessageMotification {
  width: 8px;
  height: 8px;
  background-color: #e62a10;
  border: solid 1px #ffffff;
  position: absolute;
  top: 22px;
  right: 12px;
  border-radius: 50%;
}

.filter-icon {
  position: relative;
  z-index: 9999999;
}

.serviceHeading {
  display: none;
}
.addRequestSec {
  float: left;
  width: 100%;
  background: #fff;
  height: 100vh;
}

.cancelRequestSec {
  float: left;
  width: 100%;
  background: #fff;
  height: 100vh;
}
.currentEstimation .bgHead span{
  font-weight: 700;
  font-size: 10px;
  line-height: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #7A7A7A;
}
.currentEstimation .bgHead span:first-child{
  margin: 0 0 0 28px;
}
.cancelRequestHeader {
  display: none;
}
.scrollElement{
  padding: 0 12px 0 12px;
  overflow-x: auto;
  height: 462px;
}

.ascOptionContainer .bunameHeading{
    font-size: 14px;
    font-weight: 700;
    color: #454545;
    ;
}

@media only screen and (max-width: 600px) {
  .invoiceCheckTabs{
    margin: 0 auto;
    width: 100%;
    overflow-x: auto;
    white-space: nowrap;
    padding: 8px 16px;
  }
  .invoiceCheckTabs li{
    width: 100%;
    min-width: auto;
    padding: 5px 12px;
  }
  #seePreviousModal {
    max-width: 100%;
    height: auto;
    bottom: 0;
  }
  .partsDetails li .partsName{
    width: 67%;
    margin: 0;
  }
  .partsDetails li .partsPrice {
    float: left;
    width: 33%;
  }
  .partsDetails li {
    padding: 6px 8px;
}
.partsDetails{
  padding: 10px 0 0;
}
  .checkBox {
    padding: 0px 0 16px;
}
.selectrDefBox {
  height: 94px;
}
  .selectrDefBox{
    padding: 10px 0 0;
  } 
  .cancelRequestHeader {
    display: block;
    color: white;
    width: 100%;
    background-color: #012b72;
    float: left;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.24);
    padding: 23px 0;
  }

  .cancelRequestHeader .icon-left-4 {
    float: left;
    width: auto;
    color: #eee;
    font-size: 17px;
    cursor: pointer;
    padding-left: 10px;
  }
  .cancelRequestHeader h1 {
    color: #ffffff;
    font-size: 20px;
    float: left;
    width: auto;
    font-weight: 500;
    line-height: 26px;
    padding: 0;
    margin: 0 0 0 30px;
  }
}

.addRequestHeader {
  width: 100%;
  background-color: #012b72;
  float: left;
  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.24);
  padding: 23px 0;
}

.addRequestHeader .icon-left-4 {
  float: left;
  width: auto;
  color: #eee;
  font-size: 17px;
  cursor: pointer;
}
.addRequestHeader h1 {
  color: #ffffff;
  font-size: 20px;
  float: left;
  width: auto;
  font-weight: 500;
  line-height: 26px;
  padding: 0;
  margin: 0 0 0 30px;
}
.addRequestHeader .selectPoint {
  font-size: 16px;
  color: #fff;
  font-weight: 500;
  letter-spacing: 0.5px;
  line-height: 20px;
  float: left;
  width: 100%;
  clear: both;
  margin: 30px 0 0 0;
  display: flex;
  white-space: nowrap;
  overflow: hidden;
}
.addRequestHeader .selectPoint li span {
  width: 20px;
  height: 20px;
  background: #afafaf;
  color: #012b72;
  font-size: 13px;
  font-weight: bold;
  line-height: 10px;
  text-align: center;
  margin: 0 8px 0 0;
  float: left;
  border-radius: 50%;
  padding: 5px 0 0 0;
}

.addRequestHeader .selectPoint li {
  color: #afafaf;
  display: inline-flex;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.5px;
  line-height: 20px;
  margin: 0 0 0 45px;
  white-space: nowrap;
}
.addMobileContainer {
  margin: 0 auto;
  max-width: 408px;
  width: 100%;
}

.addMobileContainer .innCont {
  float: left;
  width: 100%;
  margin: 48px 0 0 0;
  padding: 0 10px;
}

.addMobileContainer .innCont span {
  float: left;
  width: 100%;
  color: #7a7a7a;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 1px;
  line-height: 18px;
}

.addMobileContainer .innCont p {
  float: left;
  width: 100%;
  width: auto;
  color: #222222;
  font-size: 20px;
  font-weight: 500;
  line-height: 28px;
  margin: 8px 0 0 0;
}

.addMobileContainer .innCont .input-field {
  float: left;
  width: 100%;
  margin: 36px 0 0 0;
}

.addMobileContainer .innCont .actBoxDiv {
  float: left;
  width: 100%;
  margin: 77px 0 0 0;
}
.addMobileContainer .innCont .actBoxDiv i {
  font-size: 12px;
  font-weight: normal;
}

.addMobileContainer .errorMsg {
  width: calc(100% - 40px);
  color: #e62a10;
}
.addMobileContainer .errorIcon {
  float: right;
  font-size: 18px;
  margin: 10px 0 0 0;
  color: #e62a10;
}
.noteMsg {
  float: left;
  width: 100%;
  color: #7a7a7a;
  font-size: 12px;
  line-height: 18px;
  margin: 14px 0 0 0;
}
.addDevice {
  float: left;
  width: 100%;
  clear: both;
  margin: 36px 0 0 0;
}
.addDevice h4 {
  float: left;
  width: 100%;
  color: #7a7a7a;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 1px;
  line-height: 18px;
  padding: 0;
  margin: 0;
}

ul.addImg {
  float: left;
  margin: 8px 0 0 0;
  clear: both;
  width: 100%;
}
ul.addImg li:first-child {
  margin: 0;
}
ul.addImg li {
  float: left;
  width: 72px;
  height: 72px;
  border: dashed 1px #008df6;
  margin: 0 0 0 20px;
  background: #fff;
  position: relative;
}
ul.addImg li i {
  font-size: 20px;
  color: #008df6;
  position: absolute;
  left: 30px;
  top: 18px;
}
.inputFile {
  width: 72px;
  height: 72px;
  position: relative;
  z-index: 99999999999999;
  opacity: 0;
}
.deviceimagePreview {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
}
button[disabled] {
  background: #ccc !important;
}

li.activeTab {
  color: #fff !important;
}
.activeTab span {
  background: #fff !important;
}
.fetch-sr-loading {
  text-align: center;
  font-size: 14px;
  letter-spacing: 0.5px;
  color: #969696;
  line-height: 38px;
}
.loader {
  border: 2px solid #d2cece;
  border-radius: 50%;
  border-top: 2px solid #3498db;
  width: 20px;
  height: 20px;
  -webkit-animation: spin 2s linear infinite;
  color: #7a7a7a;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 1px;
  line-height: 11px;
  display: inline-flex;
  vertical-align: middle;
}
/* Safari */
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.ber-label {
  position: absolute;
  background: #848383;
  padding: 1px 10px;
  font-size: 10px;
  color: #fff;
}

.dis-device-btn {
  width: 100%;
  margin: 0px 0 0 0;
}
.discharge-device {
  padding: 10px;
  font-size: 16px;
}

input#start1 {
  text-align: center;
}

.overlay .otp-model-overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #000000ab;
  z-index: 9;
}

.resend-OTP {
  margin: 15px 0;
  float: left;
  width: 100%;
  cursor: pointer;
}

.cntOTP {
  margin: 10px 0 0 0;
}
.next-icon {
  font-size: 13px !important;
}

.marTop30 input {
  width: 60% !important;
}

.ber-amount-ack {
  /*position: absolute;
    bottom: 65px;*/
  float: left;
  width: 100%;
}

.ber-amount-ack label {
  color: black;
}

.imei-error {
  color: red !important;
}
/* AE-9173 Start */
.asc-select-container {
  margin-top: 32px;
  float: left;
  width: 316px;
  height: 296px;
}

.margin-zero {
  margin: 0 !important;
}

.disable-action {
  background: rgb(200, 229, 250);
  cursor: no-drop;
}
.color-blue {
  color: #008df6 !important;
}
/* AE-9173 End */
.paymentError {
  padding-bottom: 20px;
}
.resendLink {
  padding-bottom: 20px;
}

@media only screen and (max-width: 600px) {
  .paymentError {
    padding: 15px !important;
  }
  .resendLink {
    text-align: center !important;
  }
}

.paymentError > span {
  background-color: #f2f2f2;
  display: flex;
  padding: 5px;
  color: red;
  font-size: 14px;
  border-radius: 4px;
}

.resendLink > span {
  font-weight: medium;
  font-size: 16px;
}
.resendLink > span:hover {
  cursor: pointer;
}
.cancelButton {
  display: none;
}

.cancellationReasonDropdown input {
  width: calc(100% - 25px) !important;
  padding-right: 20px !important;
}
.cancellationReasonDropdown span.caret {
  right: 5px !important;
}
@media only screen and (max-width: 600px) {
  .cancelReason {
    padding: 20px;
    margin-top: 100px;
  }
  .cancellationReasonDropdown label {
    font-size: 14px;
  }
  .cancelButton {
    display: block;
  }
  .cancellationReasonDropdown input {
    width: 77vw !important;
  }
}

.cancelToastDiv {
  position: fixed;
  bottom: 0vh;
  z-index: 10;
}

.cancelRequestImageText {
  color: black !important;
  font-weight: normal !important;
  font-size: 16px !important;
  padding-top: 20px;
  padding-bottom: 20px;
}
.cancelServiceRequest {
  background-color: #fff;
  color: #008df6;
}
.cancellationReamrk {
  padding-top: 30px;
}
.imgBox-div {
  width: 185px;
}
.estimationFilterForm > div {
    top: 0px !important;
    right: 109px;
}

@media only screen and (max-width: 600px) {
  .estimationFilterForm > div {
    top: 0px !important;
  }
}

.frontPanelImgStyle {
  float: left;
}
.backPanelImgStyle {
  float: right;
}
.backPanelImgStyle > div {
  margin-left: 15px;
}
.cancelBtnBox {
  padding-bottom: 25px;
}
.canReqSection {
  border-bottom: 1px solid #dcdcdc !important;
}
.topTabDiv {
  float: left;
  width: auto;
  font-size: 12px;
  font-weight: 500;
  color: #fff;
  line-height: 1;
  padding: 4px 12px;
  margin: -40px 0px 20px -19px;
  white-space: nowrap;
  background: #e62a10;
  border-top-left-radius: 4px;
  border-bottom-right-radius: 4px;
}
.customer-cost-review-header {
  text-align: center;
  padding-top: 15px;
  color: gray;
}
.customer-cost-review-msg {
  background-color: #eeee;
  padding: 20px;
  margin: 15px 0 25px 0;
  text-align: center;
  border-radius: 6px;
}
@media only screen and (max-width: 600px) {
  .selectNonInsuranceBox {
    width: 80% !important;
    border-radius: 0;
    bottom: 325px !important;
  }
}
.estimationAmt {
  float: left;
  width: 30%;
  font-size: 18px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.63;
  letter-spacing: normal;
  color: #222222;
  padding: 0px 0px 20px 10px;
  text-align: center;
}
.estimationLabel {
  float: left;
  width: 70%;
  font-size: 18px;
  padding: 0px 0px 20px 0px;
  font-weight: 500;
  font-stretch: normal;
  line-height: 1.63;
  letter-spacing: normal;
  color: #222222;
}
.fullwidthBtn {
  width: 100% !important;
}
.div-disabled
{
  pointer-events: none;
  opacity: 0.5;
}
.scrollable{
  overflow-x:auto;
}
.div-disabled-transparent
{
  pointer-events: none;
}
.allowCursor{
  pointer-events: all;
}
.estimateDisabled input[type=text]:disabled {
  color: #222222;
}
.infoSecBox{border: 1px solid rgba(255,152,0,0.51); padding: 8px 12px;
  background-color: rgba(255,152,0,0.04);   color: #D18008;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 22px; float: left;
  width: 100%;
  border-radius: 2px;
}
.notRepair{ position: absolute; background-color: #E72911; left: 0; top: 0;   color: #FFFFFF; padding: 2px 6px;
  font-size: 12px; font-style: normal; border-radius: 2px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 14px;}


#fmipModal{ width: 373px; padding: 0 0 24px 0 !important;
  border-radius: 4px;
  background-color: #FFFFFF;
  box-shadow: 0 2px 7px 0 rgba(0,0,0,0.19);}

#fmipModal i{ position: absolute;  right: 5px;  top: 14px; cursor: pointer;}
  
  #fmipModal h1{ color: #454545;
    padding: 12px 20px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 30px;
    width: 100%;
    border-bottom: 1px solid #DCDCDC;
    border-radius: 4px 4px 0 0;
    background-color: #F6F6F6;
  }

  #fmipModal h3{  color: #212121; margin: 20px 20px 0 20px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 28px;}

  #fmipModal .btnSecBox{ float: left; width: 100%; margin: 42px 0 0 0; text-align: right; padding: 0 20px;}
  #fmipModal .btnSecBox .cancelRed{ color:#E72911; font-size: 12px; cursor: pointer; margin: 0 24px 0 0;}
  #fmipModal .btnSecBox .submitBlue{ color:#fff; font-size: 12px; border-radius: 2px;
    background-color: #0282F0; padding: 8px 30px; cursor: pointer;}


    .tooltipIcon { display: flex;
      position: relative;
  }
  
    .tooltipIcon .toolTipTextIcon {
      visibility:hidden;
      width: 200px;
      background-color: #454545;
      color: #fff;
      text-align: center;
      border-radius: 4px;
      padding: 5px 0;
      position: absolute;
      z-index: 1;
      top: 26px;
      left: -86px; font-style: normal;
    }
  
  .toolTipTextIcon:after {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(69, 69, 69, 0);
    border-bottom-color: #454545;
    border-width: 5px;
    margin-left: -5px;
  }
    
    .tooltipIcon:hover .toolTipTextIcon {
      visibility: visible;
    }

    .flexProp{display: flex; align-items: center;}
    p.flexProp img{margin: 0 4px; cursor:pointer;}