/************* FONT  ***********************/
  h1,
  h2,
  h3,
  h4,
  h5,
  label,
  a,
  p,
  span {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400 !important;
  }

  table,
  th,
  td,
  table span,
  table label,
  table b,
  table strong {
    font-family: Arial, Helvetica, sans-serif;
  }



  /************* LAYOUT  ***********************/
  .w-100 {
    width: 100%;
  }

  .w-90 {
    width: 90%;
  }

  .w-80 {
    width: 80%;
  }

  .w-70 {
    width: 70%;
  }

  .w-60 {
    width: 60%;
  }

  .w-50 {
    width: 50%;
  }

  .w-40 {
    width: 40%;
  }

  .w-30 {
    width: 30%;
  }

  .w-20 {
    width: 20%;
  }

  .w-10 {
    width: 10%;
  }

  .w-15 {
    width: 15%;
  }

  .w-25 {
    width: 25%;
  }

  .w-35 {
    width: 35%;
  }

  .w-45 {
    width: 45%;
  }

  .w-55 {
    width: 55%;
  }

  .w-65 {
    width: 65%;
  }

  .w-75 {
    width: 75%;
  }

  .w-85 {
    width: 85%;
  }

  .w-95 {
    width: 95%;
  }

  .no-border {
    border: none !important;
  }

  .no-padding {
    padding: 0 !important;
  }

  .p-1 {
    padding: .5rem;
  }

  .p-2 {
    padding: 1rem;
  }

  .justify-end {
    justify-content: flex-end;
  }

  .justify-between {
    justify-content: space-between;
  }

  .align-center {
    align-items: center;
  }

  .border-quantex {
    border-width: 0;
    border-color: transparent;
  }

  .border-quantex.b-1 {
    border: 1px solid transparent;
  }

  .border-quantex.b-2 {
    border: 2px solid transparent;
  }

  .border-quantex.b-3 {
    border: 3px solid transparent;
  }

  .border-quantex.bt-1 {
    border-top: 1px solid transparent;
  }

  .border-quantex.bt-2 {
    border-top: 2px solid transparent;
  }

  .border-quantex.bt-3 {
    border-top: 3px solid transparent;
  }

  .border-quantex.bb-1 {
    border-bottom: 1px solid transparent;
  }

  .border-quantex.bb-2 {
    border-bottom: 2px solid transparent;
  }

  .border-quantex.bb-3 {
    border-bottom: 3px solid transparent;
  }

  .border-quantex.bl-1 {
    border-left: 1px solid transparent;
  }

  .border-quantex.bl-2 {
    border-left: 2px solid transparent;
  }

  .border-quantex.b-3 {
    border-left: 3px solid transparent;
  }

  .border-quantex.br-1 {
    border-right: 1px solid transparent;
  }

  .border-quantex.br-2 {
    border-right: 2px solid transparent;
  }

  .border-quantex.br-3 {
    border-right: 3px solid transparent;
  }

  .border-quantex.primary {
    border-color: #2C889F;
  }

  .border-quantex.secondary {
    border-color: #4E7AE1;
  }

  .border-quantex.success {
    border-color: #1AB394;
  }

  .border-quantex.danger {
    border-color: #ED5565;
  }

  .hidden {
    display: none !important;
  }

  @media(max-width: 648px) {
    #wrapper {
      max-height: 100vh !important;
      overflow: hidden !important;
    }

    .wrapper {
      overflow-y: scroll !important;
    }

    .col-table,
    .col-details .ibox-content {
      padding: 0 !important;
    }

    .col-table .ibox-content {
      padding: 10px !important;
    }

    .col-details {
      padding: 0 !important;
      height: 100%;
    }

    .col-details .ibox {
      height: calc(100vh - 46px) !important;
      max-height: none !important;
      margin: 0;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }

    .col-details .ibox .ibox-title {
      height: 64px;
      max-height: 64px;
    }

    .col-details .ibox .ibox-content {
      height: calc(100vh - 172px);
      max-height: calc(100vh - 172px);
    }

    .col-details .ibox .footer {
      min-height: 62px;
    }

  }

  /************* ATOMS  ***********************/

  /***** BUTTONS *****/

  .btn-quantex {
    color: #35383f;
    background: #d8d8d8;
    border: 1px solid #d8d8d8;
    outline: none !important;
    opacity: 1;
    width: auto;
    border-width: 0;
    border-radius: 5px;
    padding: 8px 20px;
  }

  .btn-quantex.outline {
    color: #35383f;
    border-color: #35383f;
    background: transparent;
  }

  .btn-quantex:hover,
  .btn-quantex:active,
  .btn-quantex:focus {
    background: #E5E5E5;
    cursor: pointer;
    border-color: #e5e5e5;
  }

  .btn-quantex.outline:hover,
  .btn-quantex.outline:active,
  .btn-quantex.outline:focus {
    background: #35383f;
    border-color: #35383f;
    color: white;
  }

  .btn-quantex.disabled {
    opacity: .7;
    pointer-events: none;
  }

  .btn-quantex.primary {
    color: white;
    background-color: #2C889F;
    border-color: #2C889F;
  }

  .btn-quantex.primary:hover,
  .btn-quantex.primary:active,
  .btn-quantex.primary:focus {
    background-color: #247A90;
    border-color: #247A90;
  }

  .btn-quantex.primary.outline {
    color: #2C889F;
    background-color: transparent;
    border-color: #2C889F;
  }

  .btn-quantex.primary.outline:hover,
  .btn-quantex.primary.outline:active,
  .btn-quantex.primary.outline:focus {
    background-color: #2C889F;
    border-color: #2C889F;
    color: white;
  }

  .btn-quantex.secondary {
    color: white;
    background-color: #4E7AE1;
    border-color: #4E7AE1;
  }

  .btn-quantex.secondary:hover,
  .btn-quantex.secondary:active,
  .btn-quantex.secondary:focus {
    background-color: #3C65C4;
    border-color: #3C65C4;
  }

  .btn-quantex.secondary.outline {
    color: #4E7AE1;
    background-color: transparent;
    border-color: #4E7AE1;
  }

  .btn-quantex.secondary.outline:hover,
  .btn-quantex.secondary.outline:active,
  .btn-quantex.secondary.outline:focus {
    background-color: #3C65C4;
    border-color: #3C65C4;
    color: white;
  }

  .btn-quantex.success {
    color: white;
    background-color: #1AB394;
    border-color: #1AB394;
  }

  .btn-quantex.success:hover,
  .btn-quantex.success:active,
  .btn-quantex.success:focus {
    background-color: #19AA8D;
    border-color: #19AA8D;
  }

  .btn-quantex.success.outline {
    color: #1AB394;
    background-color: transparent;
    border-color: #1AB394;
  }

  .btn-quantex.success.outline:hover,
  .btn-quantex.success.outline:active,
  .btn-quantex.success.outline:focus {
    background-color: #19AA8D;
    border-color: #19AA8D;
    color: white;
  }

  .btn-quantex.danger {
    color: white;
    background-color: #ED5565;
    border-color: #ED5565;
  }

  .btn-quantex.danger:hover,
  .btn-quantex.danger:active,
  .btn-quantex.danger:focus {
    background-color: #E04657;
    border-color: #E04657;
  }

  .btn-quantex.danger.outline {
    color: #ED5565;
    background-color: transparent;
    border-color: #ED5565;
  }

  .btn-quantex.danger.outline:hover,
  .btn-quantex.danger.outline:active,
  .btn-quantex.danger.outline:focus {
    background-color: #E04657;
    border-color: #E04657;
    color: white;
  }

  .btn-quantex.warning {
    color: #373737;
    background-color: #F1C40F;
    border-color: #F1C40F;
  }

  .btn-quantex.warning:hover,
  .btn-quantex.warning:active,
  .btn-quantex.warning:focus {
    background-color: #E5BB15;
    border-color: #E5BB15;
  }

  .btn-quantex.warning.outline {
    color: #F1C40F;
    background-color: transparent;
    border-color: #F1C40F;
  }

  .btn-quantex.warning.outline:hover,
  .btn-quantex.warning.outline:active,
  .btn-quantex.warning.outline:focus {
    background-color: #E5BB15;
    border-color: #E5BB15;
    color: white;
  }

  .btn-quantex.info {
    color: white;
    background-color: #54C6EB;
    border-color: #54C6EB;
  }

  .btn-quantex.info:hover,
  .btn-quantex.info:active,
  .btn-quantex.info:focus {
    background-color: #51BADD;
    border-color: #51BADD;
  }

  .btn-quantex.info.outline {
    color: #54C6EB;
    background-color: transparent;
    border-color: #54C6EB;
  }

  .btn-quantex.info.outline:hover,
  .btn-quantex.info.outline:active,
  .btn-quantex.info.outline:focus {
    background-color: #51BADD;
    border-color: #51BADD;
    color: white;
  }

  .btn-quantex.dark {
    color: white;
    background-color: #35383F;
    border-color: #35383F;
  }

  .btn-quantex.dark:hover,
  .btn-quantex.dark:active,
  .btn-quantex.dark:focus {
    background-color: #000;
    border-color: #000;
  }

  .btn-quantex.dark.outline {
    color: #35383F;
    background-color: transparent;
    border-color: #35383F;
  }

  .btn-quantex.dark.outline:hover,
  .btn-quantex.dark.outline:active,
  .btn-quantex.dark.outline:focus {
    background-color: #000;
    border-color: #000;
    color: white;
  }


  /***** INPUTS *****/


  input.input-quantex {
    border-radius: 3px !important;
    background-color: white;
    background-image: none;
    border: 1px solid #e5e6e7;
    border-radius: 1px;
    color: inherit;
    display: inline-block;
    padding: 4px 10px;
    transition: border-color 0.25s ease-in-out 0s;
    width: 100%;
    outline: none !important;
    font-size: 0.9rem;
    box-shadow: none !important;
  }

  input.input-quantex:hover,
  input.input-quantex:focus,
  input.input-quantex:active {
    border-color: #ACACAC;
    transition: border-color 0.25s ease-in-out 0s;
  }

  input.input-quantex.primary:hover,
  input.input-quantex.primary:focus,
  input.input-quantex.primary:active,
  input.input-quantex.always-primary {
    border-color: #2C889F !important;
  }

  input.input-quantex.secondary:hover,
  input.input-quantex.secondary:focus,
  input.input-quantex.secondary:active,
  input.input-quantex.always-secondary {
    border-color: #4E7AE1 !important;
  }

  input.input-quantex.success:hover,
  input.input-quantex.success:focus,
  input.input-quantex.success:active,
  input.input-quantex.always-success {
    border-color: #1AB394 !important;
  }

  input.input-quantex.danger:hover,
  input.input-quantex.danger:focus,
  input.input-quantex.danger:active,
  input.input-quantex.always-danger {
    border-color: #ED5565 !important;
  }

  input.input-quantex.warning:hover,
  input.input-quantex.warning:focus,
  input.input-quantex.warning:active,
  input.input-quantex.always-warning {
    border-color: #F1C40F !important;
  }

  input.input-quantex.info:hover,
  input.input-quantex.info:focus,
  input.input-quantex.info:active,
  input.input-quantex.always-info {
    border-color: #54C6EB !important;
  }

  input.input-quantex.dark:hover,
  input.input-quantex.dark:focus,
  input.input-quantex.dark:active,
  input.input-quantex.always-dark {
    border-color: #35383F !important;
  }


  /***** TOGGLE *******/

  .slider-toggle {
    background-color: #dadada;
    color: #35383f;
  }

  .slider-toggle.off-success .off {
    color: white;
  }

  .slider-toggle.off-success {
    background-color: #1ab394;
  }

  .slider-toggle.off-secondary {
    background-color: #4E7AE1;
  }

  .slider-toggle.off-secondary .off {
    color: white;
  }

  .slider-toggle.off-danger {
    background-color: #ed5565;
  }

  .slider-toggle.off-danger .off {
    color: white;
  }

  .slider-toggle.off-primary {
    background-color: #2C889F;
  }

  .slider-toggle.off-primary .off {
    color: white;
  }

  input:checked+.slider-toggle.on-success {
    background-color: #1ab394;
  }

  input:checked+.slider-toggle.on-success .on {
    color: white;
  }

  input:checked+.slider-toggle.on-danger {
    background-color: #ed5565;
  }

  input:checked+.slider-toggle.on-danger .on {
    color: white;
  }

  input:checked+.slider-toggle.on-secondary {
    background-color: #4E7AE1;
  }

  input:checked+.slider-toggle.on-secondary .on {
    color: white;
  }

  input:checked+.slider-toggle.on-primary {
    background-color: #2C889F;
  }

  input:checked+.slider-toggle.on-primary .on {
    color: white;
  }

  /******** BADGES *********/

  .badge-quantex {
    width: 6px;
    height: 6px;
    background-color: transparent;
    float: right;
    margin-top: -3px;
    margin-right: -2px;
    border-radius: 50%;
  }

  .badge-quantex.with-count {
    width: 16px;
    height: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 9px;
    color: white !important;
  }

  .badge-quantex.danger {
    background-color: #ed5565;
  }

  .badge-quantex.warning {
    background-color: #eba53b;
  }

  .badge-label-quantex {
    background-color: #d1dade;
    color: #5e5e5e;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    padding: 3px 8px;
    text-shadow: none;
    border-radius: 0.25em;
    line-height: 1;
    white-space: nowrap;
    font-size: 10px;
  }

  .badge-label-quantex.primary {
    background-color: #2C889F;
    color: white;
  }

  .badge-label-quantex.secondary {
    background-color: #4E7AE1;
    color: white;
  }

  .badge-label-quantex.danger {
    background-color: #ed5565;
    color: white;
  }

  .badge-label-quantex.success {
    background-color: #1ab394;
    color: white;
  }

  .badge-label-quantex.info {
    background-color: #54C6EB;
    color: white;
  }

  .badge-label-quantex.warning {
    background-color: #F1C40F;
    color: #35383f;
  }

  .badge-label-quantex.warning-byma {
    background-color: #eba53b;
    color: white;
  }

  .badge-label-quantex.disabled {
    background-color: #bfbdb9;
    color: white;
  }

  .badge-label-quantex.orange {
    background: #ff6a00 !important;
    color: white;
  }

  .badge-label-quantex.accent {
    background-color: #920CE4;
    color: #fff;
  }

  .badge-label-quantex.accent.inverted {
    color: #920CE4;
    background-color: #e0c1f4;
  }

  .badge-label-quantex.table-badge {
    height: 22px;
    width: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .badge-label-quantex .fa {
    font-size: 9px;
    opacity: .8;
  }

  .badge-label-quantex .icon-wrapper {
    width: 18%;
    min-width: 13px;
    text-align: right;
    display: flex;
    justify-content: flex-end;
  }

  .badge-label-quantex .text-wrapper {
    width: 82%;
    text-align: left;
    padding-left: 8px;
  }

  .badge-label-quantex .fa.error-icon {
    background: rgba(0, 0, 0, 0.075);
    width: 13px;
    height: 13px;
    display: flex;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    font-size: 7px;
  }

  /******** BOX ****************/

  .ibox-title .actions-box {
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }


  /***** CHECKBOX AND RADIO BUTTON ***********/

  .btn-differ {
    background-color: #ff00001f;
    color: red;
    border: none;
    border-radius: 3px;
    padding: 2px 20px;
    font-size: 10px;
    font-family: 'Montserrat';
    font-weight: 400;
    letter-spacing: .3px;
    float: right;
    cursor: pointer;
    transition: all .2s ease;
  }

  .btn-differ:hover {
    background-color: #ff00002d;
    transition: all .2s ease;
  }

  .btn-differ:focus {
    background-color: red;
    color: white;
    transition: all .2s ease;
  }

  .check-quantex,
  .radio-quantex {
    height: 20px;
    width: 20px;
    position: relative;
    margin-right: 6px;
    cursor: pointer;
  }

  .check-quantex:after,
  .radio-quantex:after {
    content: '\00D7';
    display: block;
    background: white;
    background-image: url('../../img/iconfinder-icon.svg');
    pointer-events: none;
    font-size: 15px;
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    color: transparent;
    transition: 0.25s all ease-in-out;
    border-radius: 3px;
    line-height: 15px;
    background-position: 0 15px;
    background-repeat: no-repeat;
    background-size: 12px 12px;
    border-width: 2px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.2);
  }

  .radio-quantex:after {
    border-radius: 50%;
  }

  .check-quantex:checked:after,
  .radio-quantex:checked:after {
    background-color: #4e7cde;
    background-position: 2px 2px;
    border-color: #4e7cde;
  }

  .check-quantex:hover:after,
  .radio-quantex:hover:after {
    border-color: #4e7cde;
  }

  .check-quantex:indeterminate:after {
    background-image: none;
    background: white;
    border-top: 8.5px solid #4e7cde;
    border-bottom: 8.5px solid #4e7cde;
    border-left: 5px solid #4e7cde;
    border-right: 5px solid #4e7cde;
  }

  .check-form-quantex {
    display: flex;
    align-items: center;
    margin: 5px 10px 5px 0;
  }

  .check-label-quantex {
    margin: 0;
    cursor: pointer;
  }


  /******* TEXT *********/

  .text-quantex {
    color: #35383f;
  }

  .text-quantex.primary {
    color: #2C889F;
  }

  .text-quantex.secondary {
    color: #4E7AE1;
  }

  .text-quantex.success {
    color: #1AB394;
  }

  .text-quantex.danger {
    color: #ED5565;
  }

  .text-quantex.light {
    color: #F7F7F7;
  }

  .text-quantex.dark {
    color: #35383f;
  }

  .text-quantex.warning {
    color: #F1C40F;
  }

  .text-quantex.info {
    color: #54C6EB;
  }

  .text-quantex.muted {
    color: #676a6c;
  }

  tr.selected .text-quantex.success {
    color: #cbf5cd !important;
  }

  tr.selected .text-quantex.danger {
    color: #ffb6b6 !important;
  }

  .text-center {
    text-align: center !important;
  }

  .pagination {
    margin-left: 3px;
  }

  .pagination li a {
    outline: none !important;
  }

  .pagination .disabled,
  .pagination .paginate_button.active {
    opacity: .5;
    cursor: default;
  }

  /***** TAB PANEL *********/

  .tab-pane-quantex {
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    display: flex;
    flex-wrap: nowrap;
    height: 50px;
    align-items: center;
  }

  .tab-pane-quantex .navmenu-quantex {
    font-weight: 300;
    display: block;
    width: 100%;
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
    color: #a7b1c2;
    transition: all .2s ease;
    padding: 0 10px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
  }

  .tab-pane-quantex.border-only-active .navmenu-quantex {
    border-color: transparent;
    transition: all .2s ease;
  }

  .tab-pane-quantex .navmenu-quantex:hover {
    color: #888;
    transition: all .2s ease;
  }

  .tab-pane-quantex .navmenu-quantex.active,
  .tab-pane-quantex .navmenu-quantex.active:hover {
    color: #4E7AE1;
    border-color: #4E7AE1;
    transition: all .2s ease;
  }


  @media (min-width: 768px) {
    .show-in-mobile {
      display: none !important;
    }

    .hide-in-mobile {
      display: flex !important;
    }
  }

  @media (max-width: 767px) {
    .show-in-mobile {
      display: flex !important;
    }

    .hide-in-mobile {
      display: none !important;
    }

    .tab-content,
    .panel-body,
    .panel-body>div {
      height: 100%;
    }
  }

  .container-login {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    max-width: 100%;
  }

  .navbar {
    position: fixed;
    top: 0;
    z-index: 99999;
  }

  .navbar-header {
    display: flex;
    align-items: center;
  }

  .header-container {
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }

  body.mini-navbar .spinner-content {
    width: calc(100% - 70px);
    transition: all .3s ease;
  }

  body.body-small .spinner-content {
    width: 100%;
    transition: all .3s ease;
  }

  tr.selected {
    background-color: #505A78 !important;
    color: white;
  }

  .table-hover tbody tr:hover {
    transition: all .1s ease;
    background-color: #f2f9ff;
    cursor: pointer !important;
  }

  .dataTables_wrapper .dt-buttons.btn-group {
    margin-top: 15px;
    margin-bottom: 10px;
  }

  .dataTables_scrollBody {
    border-top: none !important;
    width: 100% !important;
  }

  .dataTables_scrollBody table {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .dataTables_scrollHeadInner {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  .dataTables_scrollHeadInner table {
    width: 100% !important;
  }

  tr.selected td.have-error {
    background: #ef6977 !important;
    border-color: #ef6977 !important;
    color: white !important;
  }

  .dataTables_filter {
    display: none;
  }

  .dt-buttons {
    z-index: -1 !important;
    display: none !important;
  }

  .table-striped>tbody>tr.selected {
    color: white !important;
  }

  .dataTables_wrapper.no-footer .dataTables_scrollBody {
    border: none !important;
  }

  .dataTables_wrapper .dataTables_info {
    display: none !important;
  }


  @media(max-width: 648px) {
    .s-flex-column {
      flex-direction: column;
    }
  }

  .hidden {
    display: none !important;
  }

  /**********   ALERTS BADGET *********************/

  .alert-badget-quantex {
    width: 100%;
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
    border-radius: 4px;
  }

  .alert-badget-quantex>div {
    display: flex;
    align-items: center;
  }

  .alert-badget-quantex>button {
    background: transparent;
    border: none;
    outline: none !important;
    color: white;
  }

  .alert-badget-quantex .icon-wrapper {
    width: 50px;
    height: 50px;
    background: rgba(0, 0, 0, 0.05);
    margin-right: 15px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
  }

  .alert-badget-quantex h4 {
    font-size: 16px;
  }

  .alert-badget-quantex.danger {
    background-color: #ED5565;
    color: white;
  }

  .alert-badget-quantex.success {
    background-color: #1AB394;
    color: white;
  }

  /**************** TOOLTIP ******************/

  /* This styles are here, in the component dont work because use classes of the parent components (mini-navbar is a class of body)). Dont move o remove from here */
  .mini-navbar .quantex-sidebar-tooltip:hover~.tooltip-wrapper {
    display: flex;
  }

  .mini-navbar .quantex-sidebar-tooltip:hover~.tooltip-wrapper .tooltip-content {
    opacity: 1;
    transition: all 0.2s ease;
  }

  .collapse.show .quantex-tooltip:hover+.tooltip-wrapper {
    display: flex;
  }

  .collapse.show .quantex-tooltip:hover+.tooltip-wrapper .tooltip-content {
    opacity: 1;
  }

  /************* ANIMATIONS **********************/
  .delay-0 {
    animation-delay: 0ms;
  }

  .delay-1 {
    animation-delay: 20ms;
  }

  .delay-2 {
    animation-delay: 40ms;
  }

  .delay-3 {
    animation-delay: 60ms;
  }

  .delay-4 {
    animation-delay: 80ms;
  }

  .delay-5 {
    animation-delay: 100ms;
  }

  .delay-6 {
    animation-delay: 120ms;
  }

  .delay-7 {
    animation-delay: 140ms;
  }

  .delay-8 {
    animation-delay: 160ms;
  }

  .delay-9 {
    animation-delay: 180ms;
  }

  .delay-10 {
    animation-delay: 200ms;
  }

  .delay-11 {
    animation-delay: 220ms;
  }

  .delay-12 {
    animation-delay: 240ms;
  }

  .delay-13 {
    animation-delay: 260ms;
  }

  .delay-14 {
    animation-delay: 280ms;
  }

  .delay-15 {
    animation-delay: 300ms;
  }

  .delay-16 {
    animation-delay: 320ms;
  }

  .delay-17 {
    animation-delay: 340ms;
  }

  .delay-18 {
    animation-delay: 360ms;
  }

  .delay-19 {
    animation-delay: 380ms;
  }

  .delay-20 {
    animation-delay: 400ms;
  }

  .collapse.show .quantex-tooltip:hover+.tooltip-wrapper {
    display: flex;
  }

  .collapse.show .quantex-tooltip:hover+.tooltip-wrapper .tooltip-content {
    opacity: 1;
  }

  .dropdown-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }


  .code {
    color: #D4D4D4;
    background: #1E1E1E;
    white-space: break-spaces;
    padding: 15px;
    border-radius: 3px;
    margin: 5px 25px 30px 25px;
    letter-spacing: 1px;
    word-spacing: 3px;
    max-height: auto;
    height: auto;
    overflow-y: auto;
  }

  .code .key {
    color: #9ADCFE;
  }

  .code .boolean-false {
    color: #E87E7E;
  }

  .code .boolean-true {
    color: #B4CFA7;
  }

  .code .string {
    color: #CF9176;
  }

  .code .number {
    color: #C483BF;
  }

  .response-title {
    display: flex;
    padding: 0px 30px;
    justify-content: space-between;
    align-items: center;
  }

  .sweet-alert.top-position {
    top: 35vh !important;
  }


  .badge-connection-spinner {
    width: 10px !important;
    height: 10px !important;
    margin: 0 !important;
    margin-right: 2px !important;
  }

  .badge-connection-spinner div {
    background: white !important;
  }

  td {
    vertical-align: middle !important;
  }


  #code-top {
    overflow-x: auto;
  }


  #code-top .string {
    display: inline-flex;
    width: auto;
    justify-content: flex-start;
    flex-wrap: nowrap;
    max-width: 900px;
  }

  #code-top .string span {
    margin-right: 10px;
  }



  #code-top .line-row-elements .element,
  #code-top .line-header .element {
    padding: 0 5px;
    border-right: 1px solid rgba(255, 255, 255, 0.2);
    text-align: right;
    margin: 0;
    white-space: nowrap;
  }


  #code-top .line-header .element {
    margin: 0;
    background: #cb8e75;
    color: #1f1f1f;
    border-right: 1px solid rgba(0, 0, 0, 0.3);
  }

  #code-top .line-row-elements .element-0,
  #code-top .line-header .element-0 {
    width: 70px;
    min-width: 70px;
    text-align: right;
  }

  #code-top .line-row-elements .element-1,
  #code-top .line-header .element-1 {
    width: 90px;
    min-width: 90px;
    text-align: left;
  }

  #code-top .line-row-elements .element-2,
  #code-top .line-row-elements .element-3,
  #code-top .line-header .element-3,
  #code-top .line-header .element-2 {
    width: 40px;
    min-width: 40px;
  }

  #code-top .line-row-elements .element-4,
  #code-top .line-row-elements .element-10,
  #code-top .line-header .element-4,
  #code-top .line-header .element-10 {
    width: 70px;
    min-width: 70px;
  }

  #code-top .line-row-elements .element-5,
  #code-top .line-row-elements .element-6,
  #code-top .line-header .element-5,
  #code-top .line-header .element-6,
  #code-top .line-row-elements .element-8,
  #code-top .line-row-elements .element-9,
  #code-top .line-header .element-8,
  #code-top .line-header .element-9 {
    width: 60px;
    min-width: 60px;
  }

  #code-top .line-row-elements .element-7,
  #code-top .line-header .element-7 {
    width: 20px;
    min-width: 20px;
  }

  #code-top .line-row-elements .element-11,
  #code-top .line-header .element-11 {
    min-width: 140px;
    text-align: left;
    border-right: none;
  }

  #newUser .nav-link {
    border-bottom: 3px solid transparent;
  }

  #newUser .nav-link.active {
    border: none;
    border-bottom: 3px solid #4f7ae1;
    color: #495053 !important;
  }

  #newUser .nav-tabs {
    background: white !important;
    padding-left: 5px;
  }

  #newUser .tabs-container {
    width: 100%;
  }

  #newUser .panel-body {
    border: none !important;
  }

  #newUser .input-wrapper {
    margin-bottom: 15px;
  }

  #newUser button {
    margin-bottom: 19px;
  }

  #newUser input.error,
  #newUser button.error {
    margin-bottom: 0;
    background: #fef0f2;
    border-color: #ed5565;
  }

  #newUser label.error,
  #newUser .label-error {
    margin-bottom: 0;
    font-size: 10px;
    width: 100%;
    text-align: left;
    color: #ed5565;
  }

  .dropdown-agents {
    max-height: 200px;
    overflow-y: auto;
  }

  .connecteds-info .wrapper {
    padding: 0 !important;
  }

  .connecteds-info pre {
    background-color: white !important;
    border: none !important;
  }

  .connecteds-info li b {
    font-size: 14pt !important;
  }

  .connecteds-info li span b,
  .connecteds-info li span {
    font-size: 10pt !important;
  }

  .rating-content .fa-star {
    color: #d0d0d0;
  }

  .rating-content .fa-star.filled {
    color: #e8be1d;
  }

  .dropdown-content {
    max-height: 330px;
    overflow-y: auto;
    min-width: 230px;
  }

  .fc-bgevent {
    background-color: red !important;
  }

  .fc-event-title {
    color: black !important;
    font-size: 13px !important;

  }

  .fc .fc-bg-event {
    background-color: #f5c0c0 !important;
    opacity: 1;
  }

  .fc-daygrid-event.fc-daygrid-block-event {
    background: #ffffff82 !important;
    border: none !important;
  }

  .fc-toolbar-chunk .fc-button {
    display: inline-flex !important;
    align-items: center !important;
  }

  td.fc-timegrid-slot {
    border: none !important;
  }

  .fc-timegrid-axis,
  .fc-timegrid-slot.fc-timegrid-slot-label,
  .fc-timegrid-slot-label-frame {
    background: white !important;
    opacity: 1 !important;
    width: 0px !important;
    overflow: hidden;
    padding: 0 !important;
    min-width: 0px !important;
    max-width: 0px !important;
    border: none !important;
  }

  .fc-timegrid-axis span,
  .fc-timegrid-axis div,
  .fc-timegrid-axis-frame,
  .fc-timegrid-slot.fc-timegrid-slot-label div,
  .fc-timegrid-slot-label-frame div {
    display: none;
  }

  .fc-view-harness.fc-view-harness-active .fc-scroller {
    overflow: hidden !important;
  }

  .fc-scrollgrid,
  .fc-view-harness.fc-view-harness-active {
    max-height: calc(100vh - 350px);
  }

  .fc button {
    display: inline-flex;
    align-items: center;
  }

  .hidden-content {
    display: none !important;
  }

  .combo-close-btn {
    background: #cfcfcf;
    width: 15px;
    height: 15px;
    display: inline-flex !important;
    justify-content: center;
    align-items: center;
    line-height: 0;
    padding: 0;
    border-radius: 50%;
    float: right;
    font-size: 9px;
    transform: translate(-8px, -23px);
    cursor: pointer;
  }

  .fc-daygrid-day {
    cursor: pointer;
    transition: all .2s ease;
  }

  .fc-daygrid-day:hover {
    background-color: rgb(228, 252, 249) !important;
    transition: all .2s ease;
  }

  body.fixed-sidebar.mini-navbar .nav-label,
  body.fixed-sidebar.mini-navbar .navbar-default .nav li a span,
  body.canvas-menu.mini-navbar .nav-label,
  body.canvas-menu.mini-navbar .navbar-default .nav li a span {
    display: inline-flex !important;
  }

  .badge-quantex {
    display: inline-flex !important;
  }

  .mini-navbar nav.navbar-default .badge-quantex {
    height: 8px !important;
    position: absolute;
    transform: translate(25px, -10px);
    color: #ed5565 !important;
    width: 8px;
  }

  .tippy-box[data-theme~='sidebar-tippy'] {
    display: none !important;
  }

  .mini-navbar .tippy-box[data-theme~='sidebar-tippy'] {
    display: block !important;
  }

  .no-pointer-events {
    pointer-events: none !important;
  }