@font-face {
  font-family: 'Effra';
  src: url('src/assets/css/fontawesome/webfonts/Effra_Std_Bd.ttf') format('truetype');
}

body {
  font-size: 0.9rem;
}
.card{
  border-radius: 0 !important;
}
.form-control {
  font-size: 0.9rem;
}

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


/* ::-webkit-scrollbar-track
{
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
background-color: #F5F5F5;
border-radius: 10px;
}

::-webkit-scrollbar
{
  width: 5px;
  height: 5px;
background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb
{
border-radius: 10px;
background-image: -webkit-gradient(linear,
                   left bottom,
                   left top,
                   color-stop(0.44, rgb(122,153,217)),
                   color-stop(0.72, rgb(73,125,189)),
                   color-stop(0.86, rgb(28,58,148)));
} */

::-webkit-scrollbar-track {
  border-radius: 15px;
  background-color: #F5F5F5;
}

::-webkit-scrollbar {
  width: 7px;
  height: 7px;
  background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb {
  border-radius: 15px;
  background-color: rgb(138, 137, 137);
}

.hide {
  display: none;
}

.va-theme-color-0 {
  background-image: linear-gradient(135deg, #79CAFF 0%, #597fd1 100%) !important;
}

.va-theme-color-1 {
  background-image: linear-gradient(135deg, #93F9B9 0%, #1D976C 100%) !important;
}

.va-theme-color-2 {
  background-image: linear-gradient(135deg, #97a7cc 0%, #8E54E9 100%) !important;
}

.va-theme-color-3 {
  background-image: linear-gradient(135deg, #97a7cc 0%, #ff5858 100%) !important;
}

.va-theme-color-4 {
  background-image: linear-gradient(135deg, #f3a2a2 0%, #f14e4e 100%) !important;
}

.va-theme-color-5 {
  background-image: linear-gradient(135deg, #6288dd 0%, #182848 100%) !important;
}

.va-theme-color-6 {
  background-image: linear-gradient(135deg, #7e9de3 0%, #56ab2f 100%) !important;
}

.va-theme-color-7 {
  background-image: linear-gradient(135deg, #73d546 0%, #51a12c 100%) !important;
}

.va-theme-color-8 {
  background-image: linear-gradient(135deg, #9fd546 0%, #e1af23 100%) !important;
}

.va-theme-color-9 {
  background-image: linear-gradient(135deg, #1e6264 0%, #44A08D 100%) !important;
}

.va-theme-color-10 {
  background-image: linear-gradient(135deg, #0dac3d 0%, #b6b11c 100%) !important;
}

.va-theme-color-11 {
  background-image: linear-gradient(135deg, #595959 0%, #1e1e1e 100%) !important;
}

.va-theme-color-12 {
  background: #0c9134 !important;
}

.va-theme-color-13 {
  background: #33189d !important;
}

.va-theme-color-14 {
  background: #18919d !important;
}

.va-theme-color-15 {
  background: #9d1818 !important;
}

.va-theme-color-16 {
  background: #9d9918 !important;
}

.va-theme-color-17 {
  background: #6610f2 !important;
}

.va-theme-color-18 {
  background: #e83e8c !important;
}

.va-theme-color-19 {
  background: #B06AB3 !important;
}

.va-theme-color-20 {
  background: #56ab2f !important;
}

.va-blind-theme-color-0 {
  background: #000000 !important;
}

.sidebar {
  width: 120px;
  min-height: 100%;
  bottom: 0;
  float: none;
  height: 100vh;
  overflow-y: auto;
  position: fixed;
  padding: 0;
  z-index: 9999 !important;
}


.va-content {
  margin-top: 83px;
  /* margin-left: 32px; */
  /* margin-right: -59px; */

  padding: 1rem;
}

/* .content-header{
  margin-left: 170px;
  margin-right: 305px;
}   */

.va-margin-less {
  margin-top: 40px;
}

.cursor-p {
  cursor: pointer;
}


/************************************************* Card **********************************************/

.card {
  margin-bottom: 1rem;
}

.card-header {
  padding: .75rem 1.25rem;
  position: relative;
  border-top-left-radius: .10rem;
  border-top-right-radius: .10rem;
}

.card-title {
  font-size: 1.1rem;
  font-weight: 400;
  margin: 0;
}

.card-header>.card-tools {
  margin-right: -.625rem;
}

.btn-tool {
  font-size: .875rem;
  margin: -.75rem 0;
  padding: .25rem .5rem;
}

.btn-tool:focus,
.show .btn-tool {
  box-shadow: none!important;
}

.card.maximized-card {
  height: 100%!important;
  left: 0;
  max-height: 100%!important;
  max-width: 100%!important;
  position: fixed;
  top: 0;
  width: 100%!important;
  z-index: 99999;
  overflow-y: auto
}


/*******************************************************************Buttons*******************************/

.va-button {
  /* border-radius: 3.25rem; */
  padding: .25rem 1.25rem;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.va-btn-secondary {
  background: none;
}

.dataTables_wrapper .table td,
.dataTables_wrapper .table th {
  /* padding: .35rem; */
  font-size: 0.9rem;
}

.dataTables_paginate .page-link {
  background-color: rgba(255, 255, 255, 0);
  border: 1px solid rgba(222, 226, 230, 0);
  color: inherit;
  padding: .2rem 1.0rem;
  border-radius: 1rem;
}

.dataTables_paginate .page-link:hover {
  background-color: rgba(233, 236, 239, 0);
  border-color: rgba(222, 226, 230, 0);
  color: inherit;
}

.dataTables_paginate .page-item.disabled .page-link {
  background-color: rgba(255, 255, 255, 0);
  border-color: rgba(222, 226, 230, 0);
}

.dataTables_paginate .page-item.active .page-link,
.dataTables_paginate .page-item.active .page-link:hover {
  z-index: 0;
  color: white;
}

.table {
  color: rgb(57, 56, 57);
  white-space: nowrap;
}

.table thead th {
  border-bottom: 0px solid #dee2e6;
  color: inherit !important;
  font-weight: 500;
}

.table tbody tr:hover {
  background-color: rgba(0, 0, 0, 0.02);
}


/**********************************************************Toasts*************************************************/

.toast-container.toast-top-center .ngx-toastr,
.toast-container.toast-bottom-center .ngx-toastr {
    width: 370px !important;
}

.toast-container.toast-top-center .ngx-toastr .toast-message {
    font-weight: bold;
    margin-top: 4px !important;
    font-family: 'Effra';
    font-size: 16px;
    line-height: 20px;
    margin-bottom: 5px;
    font-weight: 400;
}

.toast-close-button:hover,
.toast-close-button:focus {
    color: #ffffff !important;
    opacity: 1 !important;
}

.toast-success {
    text-align: left !important;
    background-color: rgba(223, 240, 209, 1) !important;
    color: rgba(5, 97, 27, 1) !important;
    font-family: 'Effra';
    font-size: 16px;
    line-height: 20px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 20.25C16.5563 20.25 20.25 16.5564 20.25 12C20.25 7.44365 16.5564 3.75 12 3.75C7.44365 3.75 3.75 7.44365 3.75 12C3.75 16.5563 7.44365 20.25 12 20.25ZM21.75 12C21.75 17.3848 17.3848 21.75 12 21.75C6.61522 21.75 2.25 17.3848 2.25 12C2.25 6.61522 6.61522 2.25 12 2.25C17.3848 2.25 21.75 6.61522 21.75 12Z' fill='rgb(59, 130, 94)'/%3E%3Cpath d='M16.6443 8H16.6238C16.3952 8.00537 16.1824 8.09961 16.0242 8.26465L10.3367 14.2236L8.52415 11.9575C8.38157 11.7788 8.17747 11.6665 7.95042 11.6411C7.7219 11.6152 7.49974 11.6812 7.32103 11.8237C6.95237 12.1187 6.89231 12.6582 7.18724 13.0269L9.61155 16.0576C9.76683 16.251 9.9973 16.3672 10.2429 16.3779C10.2551 16.3779 10.2668 16.3789 10.279 16.3789C10.5129 16.3789 10.7375 16.2832 10.8992 16.1133L17.2634 9.44727C17.5886 9.10596 17.5759 8.5625 17.2341 8.23682C17.074 8.0835 16.865 8 16.6443 8Z' fill='rgb(59, 130, 94)'/%3E%3C/svg%3E") !important;
    font-weight: bold;

}

.toast-error {
    text-align: left !important;
    background-color: rgba(253, 236, 234, 1) !important;
    color: rgba(199, 39, 16, 1) !important;
    font-family: 'Effra';
    font-size: 16px;
    line-height: 20px;
    font-weight: bold;

    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 20.25C16.5563 20.25 20.25 16.5564 20.25 12C20.25 7.44365 16.5564 3.75 12 3.75C7.44365 3.75 3.75 7.44365 3.75 12C3.75 16.5563 7.44365 20.25 12 20.25ZM21.75 12C21.75 17.3848 17.3848 21.75 12 21.75C6.61522 21.75 2.25 17.3848 2.25 12C2.25 6.61522 6.61522 2.25 12 2.25C17.3848 2.25 21.75 6.61522 21.75 12Z' fill='rgba(199, 39, 16, 1)'/%3E%3Cpath d='M13.412 12.2483L16.2645 9.39606C16.5751 9.07038 16.5741 8.55036 16.2606 8.23688L16.2635 8.23835L16.2567 8.23298C15.9296 7.92145 15.41 7.92243 15.0956 8.23688L12.2482 11.0847L9.39978 8.23688C9.08582 7.92243 8.56531 7.92096 8.24011 8.23298L8.23621 8.23688C7.92224 8.55036 7.92029 9.07038 8.23621 9.39997L11.0847 12.2484L8.2323 15.1011C7.92078 15.4263 7.92224 15.9468 8.24011 16.2633C8.40222 16.4195 8.61267 16.4966 8.82166 16.4966C9.03259 16.4966 9.24207 16.4176 9.39978 16.2603L12.2483 13.412L15.0956 16.2593C15.2528 16.4176 15.4618 16.4966 15.6727 16.4966C15.8827 16.4966 16.0956 16.4176 16.2606 16.2603C16.5731 15.9468 16.5751 15.4263 16.2606 15.0963L13.412 12.2483Z' fill='rgba(199, 39, 16, 1)'/%3E%3C/svg%3E") !important;
}

.toast-info {
    text-align: left !important;
    background-color: rgba(233, 230, 241, 1) !important;
    color: rgba(35, 8, 113, 1) !important;
    font-family: 'Effra';
    font-size: 16px;
    line-height: 20px;
    font-weight: bold;

    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 20.25C16.5563 20.25 20.25 16.5564 20.25 12C20.25 7.44365 16.5564 3.75 12 3.75C7.44365 3.75 3.75 7.44365 3.75 12C3.75 16.5563 7.44365 20.25 12 20.25ZM21.75 12C21.75 17.3848 17.3848 21.75 12 21.75C6.61522 21.75 2.25 17.3848 2.25 12C2.25 6.61522 6.61522 2.25 12 2.25C17.3848 2.25 21.75 6.61522 21.75 12Z' fill='rgba(35, 8, 113, 1)'/%3E%3Cpath d='M12.0037 17.0002C12.2689 17.0002 12.5232 16.8949 12.7108 16.7073C12.8983 16.5198 13.0037 16.2654 13.0037 16.0002V12.0002C13.0037 11.735 12.8983 11.4807 12.7108 11.2931C12.5232 11.1056 12.2689 11.0002 12.0037 11.0002C11.7385 11.0002 11.4841 11.1056 11.2966 11.2931C11.109 11.4807 11.0037 11.735 11.0037 12.0002V16.0002C11.0037 16.2654 11.109 16.5198 11.2966 16.7073C11.4841 16.8949 11.7385 17.0002 12.0037 17.0002ZM11.0837 8.38023C11.1056 8.44396 11.1358 8.50449 11.1737 8.56023L11.2937 8.71023C11.4343 8.84899 11.6129 8.94299 11.8069 8.98036C12.0009 9.01774 12.2016 8.99681 12.3837 8.92023C12.5049 8.86959 12.6165 8.79856 12.7137 8.71023C12.8064 8.61679 12.8797 8.50598 12.9295 8.38414C12.9792 8.2623 13.0044 8.13184 13.0037 8.00023C13.0021 7.86956 12.9749 7.74046 12.9237 7.62023C12.8788 7.49614 12.8071 7.38344 12.7138 7.29012C12.6205 7.1968 12.5078 7.12515 12.3837 7.08023C12.264 7.02733 12.1346 7 12.0037 7C11.8728 7 11.7434 7.02733 11.6237 7.08023C11.4996 7.12515 11.3869 7.1968 11.2936 7.29012C11.2002 7.38344 11.1286 7.49614 11.0837 7.62023C11.0324 7.74046 11.0053 7.86956 11.0037 8.00023C10.9988 8.06681 10.9988 8.13366 11.0037 8.20023C11.0209 8.264 11.0479 8.32472 11.0837 8.38023Z' fill='rgba(35, 8, 113, 1)'/%3E%3C/svg%3E") !important;
}

.toast-warning {
    text-align: left !important;
    background-color: rgba(253, 242, 218, 1) !important;

    color: rgba(73, 51, 4, 1)!important;
    font-family: 'Effra2';
    font-size: 16px;
    line-height: 20px;
    font-weight: bold;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 20.25C16.5563 20.25 20.25 16.5564 20.25 12C20.25 7.44365 16.5564 3.75 12 3.75C7.44365 3.75 3.75 7.44365 3.75 12C3.75 16.5563 7.44365 20.25 12 20.25ZM21.75 12C21.75 17.3848 17.3848 21.75 12 21.75C6.61522 21.75 2.25 17.3848 2.25 12C2.25 6.61522 6.61522 2.25 12 2.25C17.3848 2.25 21.75 6.61522 21.75 12Z' fill='rgba(73, 51, 4, 1)'/%3E%3Cpath d='M12 7C11.7348 7 11.4804 7.10536 11.2929 7.29289C11.1054 7.48043 11 7.73478 11 8L11 12C11 12.2652 11.1054 12.5196 11.2929 12.7071C11.4804 12.8946 11.7348 13 12 13C12.2652 13 12.5196 12.8946 12.7071 12.7071C12.8947 12.5196 13 12.2652 13 12L13 8C13 7.73478 12.8947 7.48043 12.7071 7.29289C12.5196 7.10536 12.2652 7 12 7ZM12.92 15.62C12.8981 15.5563 12.8679 15.4957 12.83 15.44L12.71 15.29C12.5694 15.1512 12.3908 15.0572 12.1968 15.0199C12.0028 14.9825 11.8021 15.0034 11.62 15.08C11.4988 15.1306 11.3872 15.2017 11.29 15.29C11.1973 15.3834 11.124 15.4943 11.0742 15.6161C11.0245 15.7379 10.9993 15.8684 11 16C11.0016 16.1307 11.0288 16.2598 11.08 16.38C11.1249 16.5041 11.1966 16.6168 11.2899 16.7101C11.3832 16.8034 11.4959 16.8751 11.62 16.92C11.7397 16.9729 11.8691 17.0002 12 17.0002C12.1309 17.0002 12.2603 16.9729 12.38 16.92C12.5041 16.8751 12.6168 16.8034 12.7101 16.7101C12.8034 16.6168 12.8751 16.5041 12.92 16.38C12.9713 16.2598 12.9984 16.1307 13 16C13.0049 15.9334 13.0049 15.8666 13 15.8C12.9828 15.7362 12.9558 15.6755 12.92 15.62Z' fill='rgba(73, 51, 4, 1)'/%3E%3C/svg%3E") !important;
}

.toast-container .ngx-toastr {
    margin-top: 10px !important;
    position: relative;
    overflow: hidden;
    margin: 0 0 6px;

    padding: 15px 15px 15px 43px !important;
    /* width: 250px !important; */
    border-radius: 1px 1px 1px 1px !important;
    background-position: 15px center;
    background-repeat: no-repeat;
    background-size: 24px;
    box-shadow: 0 0 12px #767676;
}

.toast-close-button {
    position: relative;
    right: 4px !important;
    top: 2.3px !important;
    float: right;
    width: 24px !important;
    height: 24px;
    font-size: 24px !important;
    /* color: #656464 !important; */
    text-shadow: 0 1px 0 #282727;
    /* opacity: 0.8; */
    span {
      display: flex;
      font-size: 0;
      height: 24px;
      width: 24px;
      background-size: cover;
    }
}



  .toast-bottom-left {
    bottom: 12px;
    left: 12px;
  }


.toast-success .toast-close-button {
    color: rgba(5, 97, 27, 1) !important;
    span {
      background-image: url('../../assets/img/closeToasterSuccess.svg');
    }
}

.toast-warning .toast-close-button {
    color: rgba(73, 51, 4, 1) !important;
    span {
      background-image: url('../../assets/img/closeToasterWarning.svg');
    }
}

.toast-info .toast-close-button {
    color:rgba(35, 8, 113, 1) !important;
    span {
      background-image: url('../../assets/img/closeToasterInfo.svg');
    }
}

.toast-error .toast-close-button {
    color: rgba(199, 39, 16, 1) !important;
    span {
      background-image: url('../../assets/img/closeToasterError.svg');
    }
    /* display: none !important;; */
}

/*****************************************************************************************************************/

.add-dropdown-menu {
  position: absolute;
  top: 100%;
  z-index: 8888;
  display: none;
  float: left;
  min-width: 11rem;
  padding: 0.5rem 0.5rem;
  margin: 0.1rem 0.1rem;
  font-size: 1rem;
  color: #212529;
  text-align: left;
  list-style: none;
  background-color: #ffffff;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 0.25rem;
}

.dropdown-menu-show {
  display: block;
}

.table.va-grid tbody tr.selected td {
  background: rgba(0, 0, 0, 0.07) !important;
}

.table.va-grid tbody tr {
  cursor: pointer;
}

.va-modal {
  margin-top: 100px;
  z-index: 999999;
}

.va-modal .modal-header {
  background-image: linear-gradient(135deg, #1e6264 0%, #00B398  100%) !important;
  border: 0;
  color: white;
  padding: 0.75rem 1rem;
}

.modal-backdrop {
  z-index: 99999 !important;
}

.va-modal .modal-content {
  border: 0 !important;
}

.va-modal .modal-title {
  font-size: 1rem;
}

.va-modal .modal-footer {
  padding: .25rem .75rem;
}


/**********************************************************Select*************************************************/

.select2-container {
  width: 100% !important;
}

.select2-container .select2-selection--single {
  height: calc(1.5em + .75rem + 2px) !important;
  padding: .275rem .95rem .275rem .35rem !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 6px !important;
}

.ng-dropdown-panel .ng-dropdown-panel-items .ng-option {
  background-color: #fff !important;
}

.ng-dropdown-panel .ng-dropdown-panel-items .ng-option:hover {
  background-color: #f8f8f8 !important;
}


/*****************************************************************************************************************/

.switch {
  position: relative;
  display: inline-block;
  width: 90px;
  height: 34px;
}

.switch input {
  display: none;
}

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

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked+.slideres {
  background-color: #00B398;
}

input:focus+.slideres {
  box-shadow: 0 0 1px #01937d;
}

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


/*------ ADDED CSS ---------*/

.slideon {
  display: none;
}

.slideon,
.slideoff {
  color: white;
  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  font-size: 12px;
  font-family: Verdana, sans-serif;
}

input:checked+.slider .slideon {
  display: block;
}

input:checked+.slider .slideoff {
  display: none;
}


/*--------- END --------*/


/* Rounded sliders */

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

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

.switch-mini {
  height: 30px;
}

.switch-mini .slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 8px;
  bottom: 5px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

.slideon-left {
  left: 23px;
}

.slideoff-left {
  left: 64px;
}


/******************************************************Time Line*************************/

.timeline {
  margin: 0 0 45px;
  padding: 0;
  position: relative;
}

.timeline::before {
  border-radius: .25rem;
  bottom: 0;
  content: '';
  left: 31px;
  margin: 0;
  position: absolute;
  top: 0;
  width: 4px;
}

.timeline>div {
  margin-bottom: 15px;
  margin-right: 10px;
  position: relative;
}

.timeline>.time-label>span {
  border-radius: 4px;
  background-color: #fff;
  display: inline-block;
  font-weight: 600;
  padding: 5px;
}

.timeline>div::after,
.timeline>div::before {
  content: "";
  display: table;
}

.timeline>div>.fa,
.timeline>div>.fab,
.timeline>div>.far,
.timeline>div>.fas,
.timeline>div>.glyphicon,
.timeline>div>.ion {
  background: #adb5bd;
  border-radius: 50%;
  font-size: 15px;
  height: 30px;
  left: 18px;
  line-height: 30px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 30px;
}

.bg-blue {
  background-color: #007bff!important;
}

.bg-blue,
.bg-blue>a {
  color: #fff!important;
}

.bg-red {
  background-color: #dc3545!important;
}

.bg-red,
.bg-red>a {
  color: #fff!important;
}

.timeline>div>.timeline-item {
  box-shadow: 0 0 1px rgba(0, 0, 0, .125), 0 1px 3px rgba(0, 0, 0, .2);
  border-radius: .25rem;
  margin-left: 60px;
  margin-right: 15px;
  margin-top: 0;
  padding: 0;
  position: relative;
}

.timeline>div>.timeline-item>.time {
  color: #999;
  float: right;
  font-size: 12px;
  padding: 10px;
}

.timeline>div>.timeline-item>.timeline-header {
  border-bottom: 1px solid rgba(0, 0, 0, .125);
  /* color: #495057; */
  font-size: 16px;
  line-height: 1.1;
  margin: 0;
  padding: 10px;
}

.timeline>div>.timeline-item>.timeline-header>a {
  font-weight: 600;
}

.timeline>div>.timeline-item>.timeline-body,
.timeline>div>.timeline-item>.timeline-footer {
  padding: 10px;
}

.timeline>div>.timeline-item>.timeline-footer>a {
  color: #fff;
}


/***************************************************************************************/

.card-comments {
  background: #f8f9fa;
}

.card-comments .card-comment {
  padding: 8px 0;
}

.card-comments .card-comment:first-of-type {
  padding-top: 0;
}

.card-comments .card-comment img {
  height: 1.875rem;
  width: 1.875rem;
}

.card-comments .comment-text {
  /* color: #78838e; */
  font-size: 11px;
}

.card-comments .username {
  /* color: #495057; */
  display: block;
  font-weight: 600;
}

.card-comments .text-muted {
  font-size: 10px;
  font-weight: 400;
}

.img-circle {
  border-radius: 50%;
}

.table-status-badge .nav-link {
  padding: .2rem 1rem;
  cursor: pointer;
}

.f1 {
  padding: 25px;
  background: #fff;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.f1 h3 {
  margin-top: 0;
  margin-bottom: 5px;
  text-transform: uppercase;
}

.f1-steps {
  overflow: hidden;
  position: relative;
}

.f1-progress {
  position: absolute;
  top: 24px;
  left: 0;
  width: 100%;
  height: 5px;
  background: #ddd;
}

.f1-progress-line {
  position: absolute;
  top: 0;
  height: 5px;
  background-image: linear-gradient(135deg, #00B398 30%, #230871 100%) !important;}

.f1-progress-line1 {
  position: absolute;
  top: 0;
  height: 5px;
  background: #ddd;
}

.f1-step {
  position: relative;
  width: 33.333333%;
  padding: 0 5px;
}

.f1-step-icon {
  display: inline-block;
  width: 48px;
  height: 48px;
  margin-top: 4px;
  background: rgb(221, 221, 221);
  font-size: 16px;
  color: #fff;
  line-height: 48px;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius:0;
}

.f1-step.activated .f1-step-icon {
  background: #fff;
  border: 3px solid #28a745;
  color: #28a745;
  line-height: 40px;
}

.f1-step.active .f1-step-icon {
  width: 48px;
  height: 48px;
  margin-top: 0;
  background-image: linear-gradient(135deg, #00B398 30%, #230871 100%) !important;
  font-size: 22px;
  line-height: 48px;
  font-size: 0.9rem;
}

.f1-step p {
  color: #ddd;
  text-transform: capitalize;
  font-weight: 500;
  margin: 0;
}

.f1-step.activated p {
  color: #ddd;
}

.f1-step.active p {
  color: #0c6f53;
}

.f1 fieldset {
  display: none;
  text-align: left;
}

.f1-buttons {
  text-align: right;
}

.f1 .input-error {
  border-color: #007bff;
}

.va-wizard.nav-pills .nav-link.completed {
  color: #ffffff;
  background-color: #28a745;
}

.va-wizard.nav-pills .nav-link.active {
  color: #ffffff;
  background-image: linear-gradient(135deg, #00B398 0%, #027161 100%);
}

.va-wizard.nav-pills .nav-link {
  color: #6c757d;
  margin-left: 3px;
  margin-right: 3px;
  padding: 0.7rem 1rem;
  background: #dddada;
  cursor: pointer;
}

/* .md-drppicker {
  width:
   100% !important;
} */

.md-drppicker .btn{
  border-radius: 25px !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  background-image: linear-gradient(135deg, #00B398 0%, #038c77 100%) !important;
}
.md-drppicker td.active{
  background-image: linear-gradient(135deg,  #00B398 0%, #038c77 100%) !important;
}
.md-drppicker td.active:hover{
  background-color:  #00B398 !important;
  background-image: none !important;
}

.form-control-50 {
  width: 50%;
  display: inline;
}

.gj-datepicker .input-group-append {
  pointer-events: none;
}

.gj-datepicker .input-group-append button {
  z-index: 0;
}

.gj-datepicker .form-control {
  border-right: 0px;
}

.error-msg-span {
  color: red;
}

.va-fieldset {
  min-width: 0;
  padding: 0.5rem;
  margin: 0;
  border: 1px solid #e5e4e4;
}

.va-fieldset legend {
  width: auto;
  font-size: 1rem;
  margin-bottom: 0.1rem;
}

.va-fieldset dt {
  font-weight: 200;
  color: #000000;
  font-size: 0.9rem;
}

.va-fieldset dd {
  font-weight: 500;
  color: #363636;
  font-size: 0.9rem;
}

.va-noti-box {
  border-radius: .25rem;
  box-shadow: 0 0 1px rgba(0, 0, 0, .125), 0 1px 3px rgba(0, 0, 0, .2);
  display: block;
  margin-bottom: 20px;
  position: relative;
}

.va-noti-box>.inner {
  padding: 5px;
}

.va-noti-box h3 {
  font-size: 1.3rem;
}

.va-noti-box.info-status h3 {
  color: #2F96B4!important;
}

.va-noti-box.success-status h3 {
  color: #51A351!important;
}

.va-noti-box.warning-status h3 {
  color: #F89406!important;
}

.va-noti-box.danger-status h3 {
  color: #BD362F!important;
}

.va-noti-box h3,
.va-noti-box p {
  z-index: 5;
}

.va-noti-box p {
  font-size: 0.8rem;
}

.va-noti-box .icon {
  color: rgba(0, 0, 0, .15);
  z-index: 0;
}

.va-noti-box .icon>i {
  font-size: 50px;
  top: 15px;
}

.va-noti-box .icon>i {
  position: absolute;
  right: 15px;
  transition: all .3s linear;
}

.va-noti-box.info-status .icon>i {
  color: #2F96B4!important;
}

.va-noti-box.success-status .icon>i {
  color: #51A351!important;
}

.va-noti-box.warning-status .icon>i {
  color: #F89406!important;
}

.va-noti-box.danger-status .icon>i {
  color: #BD362F!important;
}

.va-fieldset dl {
  margin-bottom: 0.4rem;
}

.va-fieldset dl dd {
  margin-bottom: 0rem;
}

.badge {
  font-weight: 500;
  padding: .25em .5em .45em .5em;
}

.va-badge-pending {
  color: #ffffff;
  background-color: #f8ab34;
}

.va-badge-verify {
  color: #ffffff;
  background-color: #8ED53C
}

.va-badge-initiated {
  color: #ffffff;
  background-color: #eb60609c
}

/*  */

.va-badge-initial {
  color: #ffffff;
  background-color: #de993e
}

.va-badge-approve {
  color: #ffffff;
  background-color: #28BAF1
}

.va-badge-reject {
  color: #ffffff;
  background-color: #FC6A8E;
}

.va-badge-delete {
  color: #ffffff;
  background-color: rgb(235, 74, 74);
}

.va-badge-process {
  color: #ffffff;
  background-color: #f8ab34;
}

.va-badge-success {
  color: #ffffff;
  background-color: #16d135;
}

.va-badge-failed {
  color: #ffffff;
  background-color: #cf0707;
}

.va-date-form-control.form-control[readonly] {
  background-color: #ffffff !important;
}

.select-filter-input {
  width: 100%;
  line-height: 25px !important;
}

.warring-input {
  border-color: red !important;
}

.warring-input>.ng-select-container {
  border: 1px solid red !important;
  border-color: red !important;
}

.warring-input>.ng-select-container {
  border: 1px solid red !important;
  border-color: red !important;
}

.gj-datepicker>.warring-input+span button {
  border: 1px solid red !important;
  border-color: red !important;
}


/* .ui-state-hover, .ui-widget-content .ui-state-hover {
  border: none !important;
  background: #597fd1;
  background-image: linear-gradient(135deg, #79CAFF 0%, #597fd1 100%) !important;
  color: #ffffff !important;
}

.ui-state-default, .ui-widget-content .ui-state-default{

  border: none !important;
  background: #ffffff;
  font-weight: normal;
  color: #1c1b1b;
}

.ui-state-highlight, .ui-widget-content .ui-state-highlight {
  border: none !important;
  background: #597fd1;
  background-image: linear-gradient(135deg, #79CAFF 0%, #597fd1 100%) !important;
  color: #ffffff !important;
}
.ui-datepicker td a {
  text-align: center !important;
}
.ui-widget-header {
  border: 1px solid #ffffff;
  background: #ffffff;
  color: #333333;
  font-weight: bold;
} */
.warring-input {
  border-color: red !important;
  animation: shake 0.5s;
}
@keyframes shake {
  0% { transform: translateX(0) rotate(0); }
  10% { transform: translateX(-2px) rotate(-1deg); }
  20% { transform: translateX(2px) rotate(1deg); }
  30% { transform: translateX(-2px) rotate(-1deg); }
  40% { transform: translateX(2px) rotate(1deg); }
  50% { transform: translateX(-2px) rotate(-1deg); }
  60% { transform: translateX(2px) rotate(1deg); }
  70% { transform: translateX(-2px) rotate(-1deg); }
  80% { transform: translateX(2px) rotate(1deg); }
  90% { transform: translateX(-2px) rotate(-1deg); }
  100% { transform: translateX(0) rotate(0); }
}

.ng-dropdown-panel {
  z-index: 1000 !important;
}

.ng-select.ng-select-opened .ng-select-container {
  z-index: 1000 !important;
}


/*------------------va status colors-----------------*/

.status-active {
  color: #ffffff;
  background-color: #008000;
}

.status-inactive {
  color: #ffffff;
  background-color: #6c7685;
}

.status-edited {
  color: #ffffff;
  background-color: #ffd050;
}

.status-pending-approval {
  color: #ffffff;
  background-color: #FF9504;
}

.status-approved {
  color: #ffffff;
  background-color: #3cc0f5;
}

.status-delete-approval {
  color: #ffffff;
  background-color: #ec5f3c;
}

.status-deleted {
  color: #ffffff;
  background-color: #e90808fb;
}

.status-unpaid {
  color: #ffffff;
  background-color: #322D2D;
}

.status-paid {
  color: #ffffff;
  background-color: #3CCEDE;
}

.status-partial {
  color: #ffffff;
  background-color: #A69E60;
}

.status-loaded {
  color: #ffffff;
  background-color: #00FF00;
}

.status-partially-onboarded {
  color: #ffffff;
  background-color: #00FF7F;
}

.status-cancel {
  color: #ffffff;
  background-color: #DC143C;
}

.status-blocked {
  color: #ffffff;
  background-color: #8B0000;
}

.status-received {
  color: #ffffff;
  background-color: #FF00FF;
}

.status-processed {
  color: #ffffff;
  background-color: #ADFF2F;
}

.status-rejected {
  color: #ffffff;
  background-color: #696969;
}

.status-repair {
  color: #ffffff;
  background-color: #e48d8d;
}

.status-disabled {
  color: #ffffff;
  background-color: #2F4F4F;
}

.status-template {
  color: #ffffff;
  background-color: #13b3b3;
}

.status-actived {
  color: #ffffff;
  background-color: #07d44b;
}

.status-preclose {
  color: #ffffff;
  background-color: #bf28dd;
}

.status-preclosd {
  color: #ffffff;
  background-color: #a1ec14;
}

.status-postclos {
  color: #ffffff;
  background-color: #0c3f1d;
}

.status-postclsd {
  color: #ffffff;
  background-color: #4e4cf5;
}

.status-finpassd {
  color: #ffffff;
  background-color: #77a777;
}

.status-finpend {
  color: #ffffff;
  background-color: #ec47a7;
}

.status-failed {
  color: #ffffff;
  background-color: #e7760c;
}


/******************************************************gj-picker*************************/

.gj-picker {
  z-index: 99999 !important;
}

/*********************orgChart***********************/
#chart-container {
width: 100%;
background: white!important;
overflow: auto;
height: 400px;
}

.orgchart .faicon {
color: white!important;
float: right;
margin-right: 4px;
cursor: pointer;
}

.orgchart .id {
display: none;
}

.orgchart .node .title .symbol {
display: none;
}

.orgchart .node-active .title {
background-color: #006699!important;
}

.orgchart .node-active .content {
border-color: #006699!important;
}

.orgchart .node-reject .title {
  background-color: #990000!important;
  }

  .orgchart .node-reject .content {
  border-color: #990000!important;
  }

.orgchart .node-not-active .title {
background-color: #adafb1!important;
}

.orgchart .node-not-active .content {
border-color: #adafb1!important;
}

.orgchart {
background: transparent;
height: 100%;
}

.orgchart.l2r {
position: relative!important;
background-image:none!important;
padding: 135px!important;
}

.orgchart .lines .topLine {
border-top: 2px solid #006699!important;
}

.orgchart .lines .leftLine {
border-left: 1px solid #006699!important;
}

.orgchart .lines .downLine {
background-color: #006699!important;
}

.orgchart .lines .rightLine {
border-right: 1px solid #006699!important;
}

.orgchart .parentnodename{
display: none;
}

.orgchart .parentnodeTitle{
display: none;
}

.orgchart .className{
  display: none;
  }

  .orgchart .rejectReason{
    display: none;
    }

    .datatable-footer {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 1em;
      font-size: 0.8rem;
      color: #6c757d;
      background-color: #ffffff;
      padding: 0.75rem 1.25rem;
      border-top: 1px solid #ffffff;
    }

    .datatable-info {
      flex: 1;
    }

    .datatable-pagination {
      display: flex;
      align-items: center;
    }

    .datatable-pagination button {
      font-size: 0.8rem;
      padding: 0.375rem 0.5rem;
      margin: 0 0.2rem;
      border-radius: 0.25rem;
      background-color: #f0f0f0;
      color: #6c757d;
      border: none;
      outline: none;
      cursor: pointer;
    }

    .datatable-pagination button:hover {
      background-color: #e0e0e0;
    }


    #tableEntries {
      display: flex;
      align-items: center;
      font-size: 14px;
      margin-bottom: 8px;
    }

    #entriesDropdown {
      width: 60px;
      height: 28px;
      margin-left: 10px;
      font-size: 14px;
      color: #212529;
      background-color: #fff;
      border: 1px solid #ced4da;
      border-radius: 0.25rem;
      outline: none;
      cursor: pointer;
    }

    #entriesDropdown:focus {
      border-color: #80bdff;
      box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
    }

    #entriesDropdown2 {
      width: 60px;
      height: 28px;
      margin-left: 10px;
      font-size: 14px;
      color: #212529;
      background-color: #fff;
      border: 1px solid #ced4da;
      border-radius: 0.25rem;
      outline: none;
      cursor: pointer;
    }

    #entriesDropdown2:focus {
      border-color: #80bdff;
      box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
    }


  #previousPageBtn{
      cursor: pointer;
  }

  #nextPageBtn{
      cursor: pointer;
  }
  .page-item{
    cursor: pointer;
  }

  .dataTables_paginate .page-link1 {
     display: none;
  }