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

    .logo-tagline {
      font-style: normal;
      font-weight: 500;
      font-size: 16px;
      line-height: 24px;
      text-align: center;
      color: #482BD9;
      margin-bottom: 40px;
    }

    .box-titles {
      color: #000;
      font-size: 16px;
      letter-spacing: 0;
      line-height: 22px;
      font-weight: 900;
    }

    .lg-fonts {
      color: #000;
      font-size: 28px;
      font-weight: 900;
      letter-spacing: 0;
      line-height: 44px;
    }

    .shadow-btm {
      box-shadow: 0 0.1rem 0.7rem rgba(0, 0, 0, .10);
      padding: 15px 20px;
      background: #fff;
      /*position: fixed;
    width: 100%;
    z-index: 9;*/
    }
    .for-valid{
      margin-top: -20px;
    }
    .has-search .form-control {
      padding-left: 32px;
    }

    .has-search .form-control-feedback {
      position: absolute;
      z-index: 2;
      display: block;
      width: 2.375rem;
      height: 2.375rem;
      line-height: 2.375rem;
      text-align: center;
      pointer-events: none;
      color: #aaa;
      font-size: 20px;
      margin-top: -2px;
    }

    body.modal-open {
      padding-right: 0 !important;
      overflow-y: scroll;
    }

    /* Dashboard */
    /*.blue-bg{
    background: #198fed;
}

.pink-bg {
    background: #f02769;
}

.skygreen-bg {
    background: #00cd98;
}*/

    .theme-border {
      border: 4px solid var(--app-theme-color);
    }

    /**/

    .fl {
      float: left
    }

    .fr {
      float: right
    }

    .table .fr {
      float: none;
    }

    .flNone {
      margin: 0 auto;
      float: none;
    }

    .fnt13 {
      font-size: 13px;
      padding-top: 5px;
    }

    .font16 {
      font-size: 18px;
      font-weight: 500
    }

    .font17 {
      font-size: 17px;
      line-height: 22px;
    }

    .md-bld {
      color: #000;
      font-size: 15px;
      letter-spacing: 0;
      line-height: 22px;
      font-weight: 500;
    }

    .lg-bld {
      font-size: 20px;
      font-weight: 600;
    }

    .st-active {
      color: #4ad395;
      text-shadow: 1px 1px 1px #ddd;
    }

    .st-pending {
      color: var(--app-theme-color);
      text-shadow: 1px 1px 1px #ddd;
    }

    .changePic {
      font-size: 15px;
      color: var(--app-theme-color);
      text-shadow: 1px 1px 1px #ddd;
      cursor: pointer;
    }

    /* Select Dropdown */

    .styled-select {
      border: 0;
      background: #fff;
      box-sizing: border-box;
      border-radius: 3px;
      overflow: hidden;
      position: relative;
      color: #000;
      font-size: 15px;
      font-weight: 500;
      opacity: .8;
      cursor: pointer;
      width: 100%;
      box-shadow: 0 0.1rem 0.7rem rgba(0, 0, 0, .10);
    }

    .styled-select select {
      width: 100%
    }

    select:focus {
      outline: 0
    }

    .styled-select select {
      background: #fff;
      border: 1px solid #ced4da;
      -webkit-appearance: none;
      color: #495057;
      font-size: 15px;
      font-weight: 400;
      padding-left: 10px;
      padding-right: 10px;
      height: 43px;
      font-family: 'Roboto', sans-serif;
      border-radius: 3px;
    }

    .bx.bx-chevron-down {
      position: absolute;
      top: 0px;
      right: 5px;
      font-size: 24px;
      color: #aaa;
    }

    .digit-group input {
      width: 60px;
      height: 45px;
      background: none;
      line-height: 50px;
      text-align: center;
      font-size: 24px;
      border: 1px solid #ced4da;
      border-radius: 3px;
      font-weight: 500;
      color: #aaa;
      font-size: 15px;
      font-weight: 400;
      margin: 0 auto;
      float: left;
    }

    .gery-bg {
      background: #eee;
      border-radius: 4px;
      box-shadow: 0 0.1rem 0.7rem rgba(0, 0, 0, .10);
      border: 1px solid #ddd;
      padding: 20px 0;
    }

    .nav.nav-pills {
      border-bottom: 1px solid #dee2e6;
    }

    .nav.nav-pills li.nav-item {
      padding-right: 25px;
    }

    .nav.nav-pills li.nav-item a {
      padding-bottom: 7px;
      color: #74798C;
      font-size: 17px;
      line-height: 20px;
    }

    /* Button */

    button.view-detail-btn, a.view-detail-btn {
      background: var(--app-theme-color);
      color: #fff;
      cursor: pointer;
      font-size: 14px;
      padding: 6px 15px;
      border: none;
      border-radius: 3px;
      font-weight: 400;
    }

    button.view-btn, a.view-btn {
      background-color: var(--app-theme-color);
      border-color: var(--app-theme-color);
      color: #fff;
      font-size: 14px;
      padding: 6px 15px;
      border-radius: 3px;
      border: none;
      font-weight: 400;
    }
    .cursor-pointer{
      cursor: pointer!important;
    }
.disabledBtnforAct{
  background-color: #9c9c9c!important;
  color: #fff!important;
  border-color: #9c9c9c!important;
  pointer-events: none!important;
}
    button.delete-btn, a.delete-btn {
      background-color: #940501;
      border-color: #940501;
      color: #fff;
      font-size: 14px;
      padding: 6px 15px;
      border: none;
      border-radius: 3px;
      font-weight: 400;
    }

    button.add-btn, a.add-btn {
      background-color: #194196;
      border-color: #194196;
      color: #fff;
      font-size: 14px;
      border: none;
      padding: 6px 15px;
      border-radius: 3px;
      font-weight: 400;
    }

    button.login-btn {
      background: #fff;
      border: 1px solid var(--app-theme-color);
      border-radius: 0.25rem;
      font-weight: 400;
      text-align: center;
      cursor: pointer;
      
      padding: 0.375rem 0.75rem;
      font-size: 14px;
      letter-spacing: 0;
      line-height: 22px;
      margin-right: 20px;
    }

    button.login-btn:hover {
      background: var(--app-theme-color);
      color: #fff;
    }

    button.border-btn {
      background: #fff;
      border: 1px solid var(--app-theme-color);
      font-weight: 400;
      text-align: center;
      cursor: pointer;
      padding: 0.375rem 0.75rem;
      line-height: 1.5;
      margin-right: 15px;
      border-radius: 0.25rem;
      transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }
    .disabledBtn{
      background: #999!important;
      pointer-events: none!important;
      color: #525252;
    }
 .disabledBtn-pointer{
      pointer-events: none!important;
    }
    .disabledBtn-pointer > img{
    filter: grayscale(80%);
    opacity: .5;
    }
    button.border-btn:hover {
      background: var(--app-theme-color);
      color: #fff;
    }
.page-content-wrapper {
  padding-bottom: 16px!important;
}
    button.fill-btn,
    a.fill-btn {
      text-transform: none;
      color: #fff;
      background-color: var(--app-theme-color);
      border-color: var(--app-theme-color);
      font-weight: 400;
      text-align: center;
      border: 1px solid transparent;
      padding: 0.375rem 0.75rem;
      line-height: 1.5;
      border-radius: 0.25rem;
      transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }

    button.fill-btn:hover,
    a.fill-btn:hover {
      background: #fff;
      border: 1px solid var(--app-theme-color);
      color: var(--app-theme-color);
    }

    a.fill-btn1 {
      text-transform: none;
      color: #fff;
      background-color: var(--app-theme-color);
      border-color: var(--app-theme-color);
      font-weight: 400;
      text-align: center;
      border: 1px solid transparent;
      padding: 3px 15px;
      line-height: 1.5;
      border-radius: 0.25rem;
      font-size: 12px;
      transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }

    img.img-radius {
      border-radius: 100px;
      float: left;
      margin-right: 10px;
    }

    .top-slider .carousel-indicators {
      bottom: -30px;
    }

    .top-slider .carousel-indicators li,
    .salarySlider .carousel-indicators li {
      border: 1px solid #0000FF;
      background: #fff;
      width: 10px;
      border-radius: 100px;
      height: 10px;
    }

    .top-slider .carousel-indicators .active,
    .salarySlider .carousel-indicators .active {
      background: #0000FF;
      width: 10px;
      border-radius: 100px;
      height: 10px;
    }

    .salarySlider .carousel-indicators {
      bottom: -50px;
    }

    .title-large {
      font-size: 20px;
      margin-top: 15px;
    }

    .time-text {
      background: #e8e8e8;
      float: left;
      border-radius: 100px;
      padding: 2px 20px;
      font-size: 12px;
      font-weight: 300;
      margin-top: 5px;
      height: 25px;
      line-height: 22px;
      color: #666;
    }

    .undread {
      background: #e8e8e8;
      border-radius: 100px;
      padding: 2px 13px;
    }

    .undread a {
      color: #666;
      font-size: 13px;
    }

    .readm {
      background: #065fd4;
      border-radius: 100px;
      padding: 2px 13px;
    }

    .readm a {
      color: #fff;
      font-size: 13px;
    }

    .browse {
      height: 40px;
      width: 100px;
      border: 1px solid #ddd;
      border-radius: 4px;
      background: none;
      color: #aaa;
      font-size: 14px;
      font-weight: 500;
      letter-spacing: 0;
      line-height: 19px;
      text-align: center;
      background: #fff;
    }

    .browse:hover {
      background: var(--app-theme-color);
      border-color: var(--app-theme-color);
      color: #fff;
    }

    .txt-right {
      text-align: right;
    }

    .datepicker-dropdown {
      box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    }

    .datepicker td,
    .datepicker th {
      width: 2.5rem;
      height: 2.5rem;
      font-size: 0.85rem;
    }

    .datepicker {
      margin-bottom: 3rem;
    }

    .datepicker.datepicker-dropdown.dropdown-menu.datepicker-orient-left.datepicker-orient-bottom {
      margin-top: 75px;
    }

    .entry-content h3 {
      font-weight: 500;
      font-size: 20px;
    }

    .entry-content ul li {
      padding-bottom: 12px;
    }

    .accordion .card {
      border: none;
      margin-bottom: 20px;
    }

    .accordion .card:last-child {
      margin-bottom: 40px;
    }

    .accordion .card h2 {
      background: #eee url(/static/images/arrow-up.webp) no-repeat calc(100% - 10px) center;
      background-size: 20px;
      font-size: 18px;
      border: 1px solid #ddd;
      padding: 12px;
      font-weight: 400;
    }

    .accordion .card h2.collapsed {
      background: #eee url(/static/images/arrow-down.webp) no-repeat calc(100% - 10px) center;
      background-size: 20px;
      font-size: 18px;
      border: 1px solid #ddd;
      padding: 12px;
      font-weight: 400;
    }

    .accordion .card-body {
      padding-left: 0;
      padding-right: 0;
    }

    a.link-btn {
      background: var(--app-theme-color);
      color: #fff;
      cursor: pointer;
      border-radius: 5px;
      font-size: 15px;
      display: block;
      padding: 2px 12px;
      text-shadow: 1px 1px 1px var(--app-theme-color);
      ;
      /*#aaa*/
    }

    .text-warning {
      color: #ffc107 !important;
    }

    .brd-circle {
      border: 1px solid #ff0000;
      width: 18px;
      height: 18px;
      display: inline-block;
      border-radius: 100px;
      text-align: center;
      position: absolute;
      right: 10px;
      top: 13px;
    }

    .brd-circle a {
      color: #ff0000;
      font-size: 17px;
      line-height: 16px;
      display: inherit;
      cursor: pointer;
    }

    .error {
      color: #ff0000 !important
    }

    .headerDropdown {
      margin-top: 0px;
      height: 44px;
      line-height: 44px;
      width: 300px;
      position: absolute;
      right: 300px;
    }

    .sort-act {
      color: var(--app-theme-color);
    }

    .multiselect__option--highlight {
      background: var(--app-theme-color) !important
    }

    .multiselect__tag {
      background: var(--app-theme-color) !important
    }

    .multiselect__option--highlight:after {
      background: var(--app-theme-color) !important
    }

    .multiselect__spinner:after {
      background: var(--app-theme-color) !important
    }

    .multiselect__spinner:before {
      background: var(--app-theme-color) !important
    }

    .multiselect__tag-icon:hover {
      background: var(--app-theme-color) !important
    }

    /* New Announcement Listing */

    .list-item {
      position: relative;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
      flex-direction: column;
      min-width: 0;
      word-wrap: break-word
    }

    .list-item.block .media {
      border-bottom-left-radius: 0;
      border-bottom-right-radius: 0
    }

    .list-item.block .list-content {
      padding: 1rem
    }

    .list-row .w-40 {
      width: 40px !important;
      height: 40px !important
    }

    .list-row .avatar {
      position: relative;
      line-height: 1;
      border-radius: 500px;
      white-space: nowrap;
      font-weight: 700;
      border-radius: 100%;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: center;
      justify-content: center;
      -ms-flex-align: center;
      align-items: center;
      -ms-flex-negative: 0;
      flex-shrink: 0;
      border-radius: 500px;
      box-shadow: 0 5px 10px 0 rgba(50, 50, 50, .15)
    }

    .list-row .avatar img {
      border-radius: inherit;
      width: 100%
    }

    .list-row .gd-primary {
      color: #fff;
      border: none;
      background: #448bff linear-gradient(45deg, #448bff, #44e9ff)
    }

    .list-row .text-color {
      color: #5e676f;
      font-weight: 500
    }

    .list-row .text-sm {
      font-size: .825rem
    }

    .list-row .list-item {
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-align: center;
      align-items: center;
      padding: 15px 0;
      border-bottom: 1px solid #ebebeb;
    }

    .list-item {
      position: relative;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
      flex-direction: column;
      min-width: 0;
      word-wrap: break-word
    }

    .posabsrht {
      position: absolute;
      right: 0;
      top: 15px;
    }

    ul.news-listing {
      margin: 0;
      padding: 0;
    }

    ul.news-listing li {
      list-style-type: none;
      /*border-bottom: 1px solid #ddd;*/
      clear: both;
      overflow: hidden;
      padding-bottom: 20px;
      margin-bottom: 20px;
    }

    .trash {
      color: #fc3d3d;
      display: inline-block;
      padding-top: 3px;
    }

    .outerDivFull .switchToggle input[type=checkbox] {
      height: 0;
      width: 0;
      visibility: hidden;
      position: absolute;
    }

    .outerDivFull .switchToggle label {
      font-size: 14px;
      font-weight: 300;
      float: left;
      cursor: pointer;
      text-indent: -9999px;
      width: 113px;
      max-width: 113px;
      height: 30px;
      background: #fc3d3d;
      display: block;
      border-radius: 100px;
      position: relative;
    }

    .outerDivFull .switchToggle label:after {
      content: '';
      position: absolute;
      top: 2px;
      left: 2px;
      width: 26px;
      height: 26px;
      background: #fff;
      border-radius: 90px;
      transition: 0.3s;
    }

    .outerDivFull .switchToggle input:checked+label,
    .switchToggle input:checked+input+label {
      background: var(--app-theme-color);
    }

    .outerDivFull .switchToggle input+label:before,
    .switchToggle input+input+label:before {
      content: 'Off';
      position: absolute;
      top: 5px;
      left: 35px;
      width: 26px;
      height: 26px;
      border-radius: 90px;
      transition: 0.3s;
      text-indent: 0;
      color: #fff;
    }

    .outerDivFull .switchToggle input:checked+label:before,
    .switchToggle input:checked+input+label:before {
      content: 'On';
      position: absolute;
      top: 5px;
      left: 10px;
      width: 26px;
      height: 26px;
      border-radius: 90px;
      transition: 0.3s;
      text-indent: 0;
      color: #fff;
    }

    .outerDivFull .switchToggle input:checked+label:after,
    .switchToggle input:checked+input+label:after {
      left: calc(100% - 2px);
      transform: translateX(-100%);
    }

    .outerDivFull .switchToggle label:active:after {
      width: 60px;
    }

    .outerDivFull .toggle-switchArea {
      margin: 10px 0 10px 0;
    }

    .outerDivFull .switchToggleRead input[type=checkbox] {
      height: 0;
      width: 0;
      visibility: hidden;
      position: absolute;
    }

    .outerDivFull .switchToggleRead label {
      font-size: 14px;
      font-weight: 300;
      float: left;
      cursor: pointer;
      text-indent: -9999px;
      width: 100px;
      max-width: 100px;
      height: 30px;
      background: #fc3d3d;
      display: block;
      border-radius: 100px;
      position: relative;
      margin-bottom: 0;
    }

    .outerDivFull .switchToggleRead label:after {
      content: '';
      position: absolute;
      top: 2px;
      left: 2px;
      width: 26px;
      height: 26px;
      background: #fff;
      border-radius: 90px;
      transition: 0.3s;
    }

    .outerDivFull .switchToggleRead input:checked+label,
    .switchToggleRead input:checked+input+label {
      background: var(--app-theme-color);
    }

    .outerDivFull .switchToggleRead input+label:before,
    .switchToggleRead input+input+label:before {
      content: 'Unread';
      position: absolute;
      top: 5px;
      left: 35px;
      width: 26px;
      height: 26px;
      border-radius: 90px;
      transition: 0.3s;
      text-indent: 0;
      color: #fff;
    }

    .outerDivFull .switchToggleRead input:checked+label:before,
    .switchToggleRead input:checked+input+label:before {
      content: 'Read';
      position: absolute;
      top: 5px;
      left: 10px;
      width: 26px;
      height: 26px;
      border-radius: 90px;
      transition: 0.3s;
      text-indent: 0;
      color: #fff;
    }

    .outerDivFull .switchToggleRead input:checked+label:after,
    .switchToggleRead input:checked+input+label:after {
      left: calc(100% - 2px);
      transform: translateX(-100%);
    }

    .outerDivFull .switchToggleRead label:active:after {
      width: 60px;
    }

    .outerDivFull .toggle-switchArea {
      margin: 10px 0 10px 0;
    }

    button.disabled,
    button:disabled {
      cursor: not-allowed;
      background: #ddd !important;
    }

    button.disabled:hover,
    button:disabled:hover {
      cursor: not-allowed;
      background: #ddd !important;
      border: 1px solid #ccc;
      color: #aaa;
    }

    .star-rating {
      direction: rtl;
      display: inline-block;
    }

    .star-rating input[type=radio] {
      display: none
    }

    .star-rating label {
      color: #bbb;
      font-size: 22px;
      padding: 0;
      cursor: pointer;
      -webkit-transition: all .3s ease-in-out;
      transition: all .3s ease-in-out
    }

    .star-rating label:hover,
    .star-rating label:hover~label,
    .star-rating input[type=radio]:checked~label {
      color: #f2b600
    }

    /* MEDIA */

    @media(max-width:767px) {
      .txt-right {
        text-align: left;
      }

      .mb15 {
        margin-bottom: 15px;
      }

      .mt15 {
        margin-top: 15px;
      }

      .mt10 {
        margin-top: 10px;
      }

      .pt15 {
        padding-top: 15px;
      }

      a.view-detail-btn {
        margin-top: 10px;
        display: inline-block;
      }

      a.link-btn {
        margin-bottom: 15px;
        font-size: 13px;
      }

      .none {
        display: none;
      }
    }

    .roundcheckbox {
      display: block;
      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;
    }

    .roundcheckbox input {
      position: absolute;
      opacity: 0;
      cursor: pointer;
      height: 0;
      width: 0;
    }

    .roundcheckbox .checkmark {
      position: absolute;
      top: 0;
      left: 50%;
      height: 25px;
      width: 25px;
      background-color: #ddd;
      border-radius: 15px;
    }

    .roundcheckbox:hover input~.checkmark {
      background-color: #ccc;
    }

    .roundcheckbox input:checked~.checkmark {
      background-color: var(--app-theme-color);
    }

    .roundcheckbox .checkmark:after {
      content: "";
      position: absolute;
      display: none;
    }

    .roundcheckbox input:checked~.checkmark:after {
      display: block;
    }

    .roundcheckbox .checkmark:after {
      left: 9px;
      top: 5px;
      width: 8px;
      height: 13px;
      border: solid white;
      border-width: 0 3px 3px 0;
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg);
    }

    img.img-radius-brd {
      border-radius: 100px;
      border: 1px solid #ddd;
      padding: 1px;
      margin-right: 10px;
    }

    .fnt15 {
      font-size: 15px !important
    }

    .msg-time {
      font-size: 12px;
      color: #000;
      font-weight: 500;
      padding-top: 10px;
      opacity: 0.5;
      font-weight: 400;
    }

    .msg-info {
      opacity: 0.5;
      color: #000;
      font-size: 13px;
    }

    .onboarding .button {
      background: #ccc;
      width: 100px;
      height: 40px;
      border-radius: 0.25rem;
      display: inline-block;
      cursor: pointer;
      border: 0;
      box-shadow: 0 1px 10px rgba(0, 0, 0, 0.3);
      font-size: 14px;
      outline: none;
    }

    .onboarding .button:hover,
    .button:focus {
      background: #f4f9fd;
    }

    .onboarding .button:active {
      background: #ecf3fb;
    }

    .onboarding .button.button-primary {
      background: var(--app-theme-color);
      color: #fff;
    }

    .onboarding .button.button-primary:hover,
    .onboarding .button.button-primary:focus {
      background: var(--app-theme-color);
    }

    .onboarding .button.button-primary:active {
      background: #316fb7;
    }

    .onboarding .button.button-nav {
      display: none;
    }

    .onboarding .button.previous {
      float: left;
    }

    .onboarding .button.next {
      float: right;
    }

    .onboarding .button.complete {
      float: right;
      display: none;
    }

    .onboarding .button:disabled {
      opacity: 0.5;
      cursor: initial;
      pointer-events: none;
    }

    .onboarding .carousel {
      width: 640px;
      margin: auto;
    }

    .onboarding .controls {
      text-align: center;
      padding: 20px;
      white-space: nowrap;
    }

    .onboarding .controls.on-last-slide .button-nav.next {
      display: none;
    }

    .onboarding .controls.on-last-slide .complete {
      display: inline-block;
    }

    .onboarding .controls.has-nav .button-nav {
      display: inline-block;
    }

    .onboarding .controls .dynamic-toggles {
      display: inline-block;
    }

    .onboarding .controls .toggle {
      margin: 0 0.25rem;
      display: inline-block;
      width: 1rem;
      height: 1rem;
      border: 0;
      background: #fff;
      border-radius: 100%;
      cursor: pointer;
      outline: none;
      background: #CDD7E0;
    }

    .onboarding .controls .toggle:hover,
    .controls .toggle:focus {
      background: #E0E8F1;
    }

    .onboarding .controls .toggle.active {
      background: var(--app-theme-color);
    }

    .onboarding .slide-container {
      height: 350px;
    }

    .onboarding .slide {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 0;
      background: #fff;
      opacity: 0;
      transition: opacity 0.3s ease;
      height: 360px;
    }

    .onboarding .slide.active {
      opacity: 1;
      z-index: 1;
    }

    .onboarding .visual-content-container {
      height: 360px;
      width: 640px;
    }

    .onboarding .visual-content-container img,
    .onboarding .visual-content-container video {
      max-width: 100%;
      max-height: 100%;
    }

    .onboarding .helper-content-container {
      display: table;
      width: 100%;
      position: absolute;
      right: 0;
      top: 220px;
      left: 0;
      height: 100px;
      box-sizing: border-box;
      padding: 0 20px;
    }

    .onboarding .helper-content {
      display: table-cell;
      vertical-align: middle;
      font-size: 1rem;
    }

    .onboarding .slide-title {
      color: #0A256C;
      font-size: 18px;
      font-weight: bold;
      letter-spacing: 0;
      line-height: 21px;
    }

    .onboarding .para {
      color: #000000;
      font-size: 16px;
      letter-spacing: 0;
      line-height: 22px;
      text-align: center;
    }

    @media(max-width:992px) {
      .onboarding .carousel {
        width: 100%;
        margin: auto;
      }

      .onboarding .visual-content-container {
        height: 360px;
        width: 100%;
      }
    }

    a.badge-btn {
      display: inline-block;
      cursor: pointer;
      background: var(--app-theme-color);
      border-radius: 100px;
      padding: 2px 10px;
      color: #FFF;
      font-size: 11px;
      margin-top: 10px;
    }

    .brdtable {
      border: 1px solid #DDD;
      padding: 10px;
      background: #F9F9F9;
    }

    .trskygreen {
      background-color: #E2EFDA !important
    }

    .trskyorange {
      background-color: #FCE4D6 !important
    }

    .trskyblue {
      background-color: #BDD7EE !important
    }

    .trskywhite {
      background-color: #fff !important
    }

    .switch-btn .btn-toggle {
      margin: 0 4rem;
      padding: 0;
      position: relative;
      border: none;
      height: 1.5rem;
      width: 3rem;
      border-radius: 1.5rem;
      color: #6B7381;
      background: #BDC1C8;
    }

    .switch-btn .btn-toggle:before,
    .switch-btn .btn-toggle:after {
      color: #6B7381;
    }

    .switch-btn .btn-toggle.active {
      background-color: var(--app-theme-color);
    }

    .switch-btn .btn-toggle.btn-lg {
      margin: 0 5rem;
      padding: 0;
      position: relative;
      border: none;
      height: 2.5rem;
      width: 5rem;
      border-radius: 2.5rem;
    }

    .switch-btn .btn-toggle.btn-lg:focus,
    .switch-btn .btn-toggle.btn-lg.focus,
    .switch-btn .btn-toggle.btn-lg:focus.active,
    .switch-btn .btn-toggle.btn-lg.focus.active {
      outline: none;
    }

    .switch-btn .btn-toggle.btn-lg:before,
    .switch-btn .btn-toggle.btn-lg:after {
      line-height: 2.5rem;
      width: 5rem;
      text-align: center;
      font-weight: 500;
      font-size: 1rem;
      text-transform: uppercase;
      letter-spacing: 2px;
      position: absolute;
      bottom: 0;
      transition: opacity 0.25s;
    }

    .switch-btn .btn-toggle.btn-lg:before {
      content: 'Yes';
      left: -5rem;
    }

    .switch-btn .btn-toggle.btn-lg:after {
      content: 'No';
      right: -5rem;
      opacity: 0.5;
    }

    .switch-btn .btn-toggle.btn-lg>.handle {
      position: absolute;
      top: 0.3125rem;
      left: 0.3125rem;
      width: 1.875rem;
      height: 1.875rem;
      border-radius: 1.875rem;
      background: #FFF;
      transition: left 0.25s;
    }

    .switch-btn .btn-toggle.btn-lg.active {
      transition: background-color 0.25s;
    }

    .switch-btn .btn-toggle.btn-lg.active>.handle {
      left: 2.8125rem;
      transition: left 0.25s;
    }

    .switch-btn .btn-toggle.btn-lg.active:before {
      opacity: 0.5;
    }

    .switch-btn .btn-toggle.btn-lg.active:after {
      opacity: 1;
    }

    .vue__time-picker {
      width: 100% !important
    }

    .vue__time-picker.input.display-time {
      width: 100% !important
    }

    .vue__time-picker input.display-time {
      width: 100% !important;
      border: 1px solid #ced4da !important;
      border-radius: 3px !important;
      transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
      box-shadow: 0 0.1rem 0.7rem rgba(0, 0, 0, .10) !important;
      height: 42px !important;
    }

    .tox .tox-statusbar {
      resize: none !important;
      pointer-events: none !important;
    }

    .mx-datepicker {
      width: 100% !important;
    }

    .role-level-1 {
      background: #e4e4e4;
      padding: 10px 0;
      border-bottom: 1px solid #c5c5c5;
    }

    .role-level-2 {
      background: #ececec;
      padding: 8px 0;
      border-bottom: 1px solid #dadada;
    }

    .role-level-3 {
      background: #f7f7f7;
      padding: 8px 0;
      border-bottom: 1px solid #e4e4e4;
    }

    div[aria-expanded=true] .bx.bx-plus {
      display: none;
    }

    div[aria-expanded=false] .bx.bx-minus {
      display: none;
    }

    .role-collapse .bx {
      margin-right: 10px
    }

    /* Today 25-11-2021 */

    .posrel {
      position: relative;
    }

    .posabs {
      position: absolute;
      right: -5px;
      top: -55px;
    }

    .height65 {
      height: 95px;
    }

    .panel {
      display: none;
      position: absolute;
      right: 0;
      -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, .15);
      box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, .15);
      line-height: initial;
      background: #fff;
      border-radius: 15px;
      padding: 10px 15px;
      z-index: 9;
      width: 200px;
      text-align: left;
      font-size: 14px;
      color: #5f5f5f;
      border: 1px solid #eee;
    }

    .brd_btm {
      border-bottom: 1px solid #ddd;
      padding-top: 10px;
      padding-bottom: 10px;
    }

    a.apply-btn {
      background: var(--app-theme-color);
      color: #fff;
      cursor: pointer;
      font-size: 15px;
      padding: 6px 15px;
      border-radius: 100px;
      font-weight: 400;
      margin-top: 10px;
      display: inline-block;
      text-align: center;
    }

    .brd-btm {
      border-bottom: 1px solid rgba(0, 0, 0, 0.1);
      padding-bottom: 5px;
    }

    .border-alls {
      border: 2px solid #ddd;
      border-radius: 5px;
      padding: 15px;
      /*background: #eee;*/
    }

    .abs {
      position: absolute;
      right: 15px;
    }

    .geryBox {
      background: #f6f6f6;
      border-radius: 5px;
      border: 1px solid #eee;
      padding: 10px !important;
    }

    .gery-bg {
      background: #eee;
      border-radius: 4px;
      box-shadow: 0 0.1rem 0.7rem rgba(0, 0, 0, .10);
      border: 1px solid #ddd;
      padding: 20px 0;
    }

    .input-daterange input {
      padding: 10px 15px !important;
      border-radius: 10px !important;
      box-sizing: border-box;
      background-color: #fff !important;
      color: #000 !important;
      font-size: 16px !important;
      letter-spacing: 1px;
      position: relative;
      width: 100%;
      box-shadow: 0 0.1rem 0.7rem rgba(0, 0, 0, .10);
      border: 1px solid rgba(0, 0, 0, 0);
    }

    .input-daterange input:focus {
      -moz-box-shadow: none !important;
      -webkit-box-shadow: none !important;
      box-shadow: none !important;
      border: 1px solid #FFA000 !important;
      outline-width: 0;
      outline: 0
    }

    .input-daterange .daterangepicker {
      background-color: #fff;
      border-radius: 0 !important;
      align-content: center !important;
      padding: 0 !important
    }

    .input-daterange .month {
      font-size: 16px !important;
      padding-bottom: 10px !important;
      padding-top: 10px !important
    }

    .start-date,
    .end-date {
      border-radius: 0px !important
    }

    .daterangepicker td.active,
    .daterangepicker td.active:hover,
    .daterangepicker .ranges li.active {
      background: var(--app-theme-color) !important;
    }

    .posAbs {
      position: absolute;
      right: 15px;
    }

    .periodate {
      background: #fff;
      cursor: pointer;
      padding: 7px 10px;
      border: 1px solid #ddd;
      border-radius: 5px;
    }

    .link-blueclr {
      color: #32A2D6
    }

    .dark-blue-box {
      border-radius: 8px;
      background-color: #0000FF;
      box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
      color: #fff;
    }

    .dark-yellow-box {
      padding: 15px;
      background: #FFD701;
      border-radius: 8px;
      background-color: #FFD701;
      box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    }

    .continue-btn {
      box-sizing: border-box;
      border: 1px solid #00B0F0;
      border-radius: 29.5px;
      color: #00B0F0;
      font-size: 18px;
      font-weight: 600;
      letter-spacing: 0;
      line-height: 22px;
      text-align: center;
      background: #fff;
      padding: 7px 25px;
      width: 250px;
      height: 55px;
    }

    .continue-btn:hover {
      background: #00B0F0;
      color: #fff;
    }

    .tableFixHead {
      overflow-y: auto;
      /* height: 480px; */
    }

    .tableFixHead thead th {
      position: sticky;
      top: 0;
      background: #eee;
    }

    .tableFixHead table {
      border-collapse: collapse;
      width: 100%;
    }

    .table tr td,
    .table tr th {
      font-size: 14px;
    }

    .role-level-1 {
      background: #e4e4e4;
      padding: 10px 0;
      border-bottom: 1px solid #c5c5c5;
    }

    .role-level-2 {
      background: #ececec;
      padding: 8px 0;
      border-bottom: 1px solid #dadada;
    }

    .role-level-3 {
      background: #f7f7f7;
      padding: 8px 0;
      border-bottom: 1px solid #e4e4e4;
    }

    div[aria-expanded=true] .bx.bx-plus {
      display: none;
    }

    div[aria-expanded=false] .bx.bx-minus {
      display: none;
    }

    .role-collapse .bx {
      margin-right: 10px
    }

    .yellow-box {
      box-sizing: border-box;
      border: 1px solid #EFEFEF;
      border-radius: 8px;
      background-color: #FFD701;
      box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
      padding: 10px 0 5px 0;
    }

    .yellow-box label,
    .yellow-box b {
      color: #fff;
      font-weight: 500;
    }

    .securityPIN {
      color: #0000FF;
      font-size: 15px;
      letter-spacing: 0;
      line-height: 22px;
      text-align: center;
    }

    .needhelp {
      color: #FFD701;
      text-align: center;
      font-size: 15px;
    }

    .yellow-btn {
      background: #FFD701;
      border-radius: 29.5px;
      color: #fff;
      font-size: 16px;
      font-weight: 400;
      letter-spacing: 0;
      line-height: 22px;
      text-align: center;
      padding: 7px 25px;
      width: 200px;
      height: 50px;
      border: 0;
    }

    .yellow-btn:hover {
      background: #FFD701;
      color: #fff;
      border: 0;
    }

    .view-details-btn {
      box-sizing: border-box;
      height: 35px;
      width: 150px;
      border: 1px solid #002060;
      border-radius: 29.5px;
      box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
      color: #002060;
      display: inline-block;
      font-size: 14px;
      font-weight: bold;
      letter-spacing: 0;
      line-height: 33px;
      text-align: center;
    }

    .view-details-btn:hover {
      color: #fff;
      background: #002060;
    }

    .select-btn {
      box-sizing: border-box;
      height: 35px;
      width: 150px;
      background: #002060;
      border: 1px solid #002060;
      border-radius: 29.5px;
      box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
      color: #fff;
      display: inline-block;
      font-size: 14px;
      font-weight: bold;
      letter-spacing: 0;
      line-height: 33px;
      text-align: center;
    }

    .select-btn:hover {
      color: #002060;
      border: 1px solid #002060;
      background: #fff;
    }

    .news-active {
      background-color: #0000FF;
      color: #fff
    }

    .news-inactive {
      background: rgba(0, 0, 255, 0.3);
      color: #4A4956
    }

    .get-rewarded {
      color: #FFD701;
      font-size: 20px;
      font-weight: bold;
      letter-spacing: 0;
      line-height: 26px;
      text-align: center;
    }

    .referral-code {
      box-sizing: border-box;
      height: 60px;
      width: 190px;
      margin: 0 auto;
      text-align: center;
      border: 1px dashed #0000FF;
      border-radius: 29.5px;
      background-color: #FFFFFF;
      color: #0000FF;
      font-size: 25px;
      font-weight: bold;
      letter-spacing: 7px;
      line-height: 60px;
      margin-top: 15px;
    }

    a.change-ps {
      border: 1px solid #00B0F0;
      border-radius: 29.5px;
      color: #00B0F0;
      cursor: pointer;
      font-size: 14px;
      display: block;
      padding: 5px 15px;
    }

    .control-dir {
      position: absolute;
      right: -20px;
      bottom: -45px;
    }

    .modal-header {
      display: inline-block;
    }

    .close {
      position: absolute;
      top: 10px;
      right: 15px;
    }

    .tox-tinymce {
      height: 480px !important;
    }

    .vue__time-picker .dropdown ul li:not([disabled]).active {
      background: #FFD600 !important;
    }

    a.hyper-link {
      text-decoration: underline;
      color: var(--app-theme-color);
      font-size: 12px;
      float: right;
    }

    .box-height {
      min-height: 480px;
    }

    .inner-height {
      height: 40px !important;
      display: inline-block;
      line-height: 26px !important;
      width: 100%;
    }

    .font15 {
      font-size: 16px;
      font-weight: 400;
    }

    .mt29 {
      margin-top: 29px;
    }

    .position-reporting span {
      width: 42px;
      float: left;
      padding-bottom: 10px;
    }

    .posr {
      position: relative;
    }

    .cross-btns {
      position: absolute;
      right: 5px;
      top: 8px;
    }

    .border-radius {
      border: 1px solid #ccc;
      padding: 15px;
      border-radius: 5px;
    }

    .wid47 {
      width: 47%;
      float: left;
    }

    td.tbl-txt-clr {
      color: #482bd9;
    }

    /*  */

    .white-box {
      background: #FFFFFF;
      border: 1px solid #E0E0E0;
      box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.08);
      border-radius: 12px;
      clear: both;
      overflow: hidden;
      padding: 10px 20px;
    }

    .bx.bx-chevron-down {
      top: -1px !important;
      right: 5px !important;
    }

    .form-control {
      padding: 0 8px;
    }

    input[type="date"].form-control {
      text-transform: uppercase;
      font-size: 13px;
    }

    /* .footer {
        position: relative !important;
    } */

    .input-group-text {
      height: 34px;
    }

    .org-bg {
      background: #F9D9D9 !important;
    }

    .yellow-bg {
      background: #FFF4B9 !important;
    }

    .green-bg {
      background: #C5E1C6 !important;
    }

    .blue-bg {
      background: #D9E8F4 !important;
    }

    .multiselect__tags {
      min-height: 34px !important;
    }

    .multiselect__placeholder {
      margin-bottom: 0 !important;
    }

    .multiselect__tags {
      padding-top: 3px !important;
    }

    .mx-datepicker,
    .vue__time-picker input.display-time {
      height: 34px !important;
    }

    .mx-icon-calendar,
    .mx-icon-clear {
      right: 0 !important;
    }

    .multiselect.multiselect--disabled,
    .mx-datepicker.disabled {
      background-color: #e9ecef;
      opacity: 1;
    }

    .multiselect.multiselect--disabled .multiselect__tags,
    .mx-datepicker.disabled .mx-input:disabled {
      background-color: transparent;

    }

    .table-loader {
      background: white;
      border-radius: 0 0 16px 16px;
    }

    .multiselect__select {
      height: 34px !important;
    }

    .multiselect__tags {
      min-height: 32px !important;
    }

    .iti.iti--allow-dropdown {
      width: 100%;
    }

    .multiselect .multiselect__single {
      background-color: transparent;
    }


    .table.table-striped .multiselect__input {
      border: 0px;
    }

    .multiselect,
    .multiselect__input,
    .multiselect__single {
      font-family: inherit;
      font-size: 16px;
      -ms-touch-action: manipulation;
      touch-action: manipulation;
      box-shadow: 0 0.1rem 0.7rem rgba(0, 0, 0, .10);
      border: 1px solid #ced4da;
      border-radius: 6px;
    }

    .multiselect {
      -webkit-box-sizing: content-box;
      box-sizing: content-box;
      display: block;
      position: relative;
      width: 100%;
      min-height: 32px !important;
      text-align: left;
      color: #35495e;
    }

    .multiselect,
    .multiselect__input,
    .multiselect__single {
      box-shadow: transparent !important;
      box-shadow: none !important;
    }

    input[type="text"][disabled] {
      color: #35495e !important;
    }
    .multiselect--above .multiselect__content-wrapper{
      z-index: 999999999999!important;
    }
    @media screen and (max-width: 1920px) {
      .w-14{
        -ms-flex: 0 0 10%;
        flex: 0 0 10%;
        max-width: 14%;
      }
      .w-27{
        -ms-flex: 0 0 27.66666666666%;
    flex: 0 0 31.66666666666%;
    max-width: 33.66666666666%;
      }
    }
    @media screen and (max-width: 1770px) {
      .w-100{
       -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
      }
      .w-29{
        -ms-flex: 0 0 29.66666666666%;
    flex: 0 0 29.66666666666%;
    max-width: 29.66666666666%;
      }
      .w-27{
        -ms-flex: 0 0 27.66666666666%;
    flex: 0 0 27.66666666666%;
    max-width: 27.66666666666%;
      }
      .w-12{
        -ms-flex: 0 0 12%;
    flex: 0 0 12%;
    max-width: 12%;
      }
      .w-14{
        -ms-flex: 0 0 14%;
    flex: 0 0 14%;
    max-width: 14%;
      }
    }