/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 */
 html {
    font-family: sans-serif;
    /* 1 */
    -ms-text-size-adjust: 100%;
    /* 2 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
  }
  /**
   * Remove default margin.
   */
  body {
    margin: 0;
  }
  /* HTML5 display definitions
     ========================================================================== */
  /**
   * Correct `block` display not defined for any HTML5 element in IE 8/9.
   * Correct `block` display not defined for `details` or `summary` in IE 10/11
   * and Firefox.
   * Correct `block` display not defined for `main` in IE 11.
   */
  article,
  aside,
  details,
  figcaption,
  figure,
  footer,
  header,
  hgroup,
  main,
  menu,
  nav,
  section,
  summary {
    display: block;
  }
  /**
   * 1. Correct `inline-block` display not defined in IE 8/9.
   * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
   */
  audio,
  canvas,
  progress,
  video {
    display: inline-block;
    /* 1 */
    vertical-align: baseline;
    /* 2 */
  }
  /**
   * Prevent modern browsers from displaying `audio` without controls.
   * Remove excess height in iOS 5 devices.
   */
  audio:not([controls]) {
    display: none;
    height: 0;
  }
  /**
   * Address `[hidden]` styling not present in IE 8/9/10.
   * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
   */
  [hidden],
  template {
    display: none;
  }
  /* Links
     ========================================================================== */
  /**
   * Remove the gray background color from active links in IE 10.
   */
  a {
    background-color: transparent;
  }
  /**
   * Improve readability of focused elements when they are also in an
   * active/hover state.
   */
  a:active,
  a:hover {
    outline: 0;
  }
  /* Text-level semantics
     ========================================================================== */
  /**
   * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
   */
  abbr[title] {
    border-bottom: 1px dotted;
  }
  /**
   * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
   */
  b,
  strong {
    font-weight: bold;
  }
  /**
   * Address styling not present in Safari and Chrome.
   */
  dfn {
    font-style: italic;
  }
  /**
   * Address variable `h1` font-size and margin within `section` and `article`
   * contexts in Firefox 4+, Safari, and Chrome.
   */
  h1 {
    font-size: 2em;
    margin: 0.67em 0;
  }
  /**
   * Address styling not present in IE 8/9.
   */
  mark {
    background: #ff0;
    color: #000;
  }
  /**
   * Address inconsistent and variable font size in all browsers.
   */
  small {
    font-size: 80%;
  }
  /**
   * Prevent `sub` and `sup` affecting `line-height` in all browsers.
   */
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sup {
    top: -0.5em;
  }
  sub {
    bottom: -0.25em;
  }
  /* Embedded content
     ========================================================================== */
  /**
   * Remove border when inside `a` element in IE 8/9/10.
   */
  img {
    border: 0;
  }
  /**
   * Correct overflow not hidden in IE 9/10/11.
   */
  svg:not(:root) {
    overflow: hidden;
  }
  /* Grouping content
     ========================================================================== */
  /**
   * Address margin not present in IE 8/9 and Safari.
   */
  figure {
    margin: 1em 40px;
  }
  /**
   * Address differences between Firefox and other browsers.
   */
  hr {
    box-sizing: content-box;
    height: 0;
  }
  /**
   * Contain overflow in all browsers.
   */
  pre {
    overflow: auto;
  }
  /**
   * Address odd `em`-unit font size rendering in all browsers.
   */
  code,
  kbd,
  pre,
  samp {
    font-family: monospace, monospace;
    font-size: 1em;
  }
  /* Forms
     ========================================================================== */
  /**
   * Known limitation: by default, Chrome and Safari on OS X allow very limited
   * styling of `select`, unless a `border` property is set.
   */
  /**
   * 1. Correct color not being inherited.
   *    Known issue: affects color of disabled elements.
   * 2. Correct font properties not being inherited.
   * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
   */
  button,
  input,
  optgroup,
  select,
  textarea {
    color: inherit;
    /* 1 */
    font: inherit;
    /* 2 */
    margin: 0;
    /* 3 */
  }
  /**
   * Address `overflow` set to `hidden` in IE 8/9/10/11.
   */
  button {
    overflow: visible;
  }
  /**
   * Address inconsistent `text-transform` inheritance for `button` and `select`.
   * All other form control elements do not inherit `text-transform` values.
   * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
   * Correct `select` style inheritance in Firefox.
   */
  button,
  select {
    text-transform: none;
  }
  /**
   * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
   *    and `video` controls.
   * 2. Correct inability to style clickable `input` types in iOS.
   * 3. Improve usability and consistency of cursor style between image-type
   *    `input` and others.
   * 4. CUSTOM FOR WEBFLOW: Removed the input[type="submit"] selector to reduce
   *    specificity and defer to the .w-button selector
   */
  button,
  html input[type="button"],
  input[type="reset"] {
    -webkit-appearance: button;
    /* 2 */
    cursor: pointer;
    /* 3 */
  }
  /**
   * Re-set default cursor for disabled elements.
   */
  button[disabled],
  html input[disabled] {
    cursor: default;
  }
  /**
   * Remove inner padding and border in Firefox 4+.
   */
  button::-moz-focus-inner,
  input::-moz-focus-inner {
    border: 0;
    padding: 0;
  }
  /**
   * Address Firefox 4+ setting `line-height` on `input` using `!important` in
   * the UA stylesheet.
   */
  input {
    line-height: normal;
  }
  /**
   * It's recommended that you don't attempt to style these elements.
   * Firefox's implementation doesn't respect box-sizing, padding, or width.
   *
   * 1. Address box sizing set to `content-box` in IE 8/9/10.
   * 2. Remove excess padding in IE 8/9/10.
   */
  input[type="checkbox"],
  input[type="radio"] {
    box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 2 */
  }
  /**
   * Fix the cursor style for Chrome's increment/decrement buttons. For certain
   * `font-size` values of the `input`, it causes the cursor style of the
   * decrement button to change from `default` to `text`.
   */
  input[type="number"]::-webkit-inner-spin-button,
  input[type="number"]::-webkit-outer-spin-button {
    height: auto;
  }
  /**
   * 1. CUSTOM FOR WEBFLOW: changed from `textfield` to `none` to normalize iOS rounded input
   * 2. CUSTOM FOR WEBFLOW: box-sizing: content-box rule removed
   *    (similar to normalize.css >=4.0.0)
   */
  input[type="search"] {
    -webkit-appearance: none;
    /* 1 */
  }
  /**
   * Remove inner padding and search cancel button in Safari and Chrome on OS X.
   * Safari (but not Chrome) clips the cancel button when the search input has
   * padding (and `textfield` appearance).
   */
  input[type="search"]::-webkit-search-cancel-button,
  input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  /**
   * Define consistent border, margin, and padding.
   */
  fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
  }
  /**
   * 1. Correct `color` not being inherited in IE 8/9/10/11.
   * 2. Remove padding so people aren't caught out if they zero out fieldsets.
   */
  legend {
    border: 0;
    /* 1 */
    padding: 0;
    /* 2 */
  }
  /**
   * Remove default vertical scrollbar in IE 8/9/10/11.
   */
  textarea {
    overflow: auto;
  }
  /**
   * Don't inherit the `font-weight` (applied by a rule above).
   * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
   */
  optgroup {
    font-weight: bold;
  }
  /* Tables
     ========================================================================== */
  /**
   * Remove most spacing between table cells.
   */
  table {
    border-collapse: collapse;
    border-spacing: 0;
  }
  td,
  th {
    padding: 0;
  }
  

/* WEB FLOW */

/* @font-face {
    font-family: 'webflow-icons';
    src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg6SAy0AAAC8AAAAYGNtYXAaVcxaAAABHAAAAExnYXNwAAAAEAAAAWgAAAAIZ2x5ZgscV1gAAAFwAAABhGhlYWQCkFKvAAAC9AAAADZoaGVhB0MDyQAAAywAAAAkaG10eBIAA10AAANQAAAAIGxvY2EBMADyAAADcAAAABJtYXhwAAwATQAAA4QAAAAgbmFtZWTuiIAAAAOkAAABe3Bvc3QAAwAAAAAFIAAAACAAAwQAAZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADmAwPA/8D/wAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIOYD//3//wAAAAAAIOYA//3//wAB/+MaBAADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQEgAAADIAOAAAUAAAkBBwkBFwMg/kBAAYD+gEABwAHAQP6A/oBAAAEA4AAAAuADgAAFAAATARcJAQfgAcBA/oABgEABwAHAQP6A/oBAAAADAMAA4ANAAsAAGAAxAEoAAAEhIg4CHQEUHgIzITI+Aj0BNC4CIxUhIg4CHQEUHgIzITI+Aj0BNC4CIxUhIg4CHQEUHgIzITI+Aj0BNC4CIwMg/cAHCwkFBQkLBwJABwsJBQUJCwf9wAcLCQUFCQsHAkAHCwkFBQkLB/3ABwsJBQUJCwcCQAcLCQUFCQsHAsAFCQsHIAcLCQUFCQsHIAcLCQXABQkLByAHCwkFBQkLByAHCwkFwAUJCwcgBwsJBQUJCwcgBwsJBQAAAAABAJ0AtAOBApUABQAACQIHCQEDJP7r/upcAXEBcgKU/usBFFv+egGGAAAAAAEAAAABAADSLAJOXw889QALBAAAAAAAz/iHGQAAAADP+IcZAAAAAAOBA4AAAAAIAAIAAAAAAAAAAQAAA8D/wAAABAAAAAAAA4EAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAACAAAABAABIAQAAOAEAADABAAAnQAAAAAACgAUAB4AMgBGAKwAwgAAAAEAAAAIAEsAAwAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAaAAAAAQAAAAAAAgAOAHEAAQAAAAAAAwAaADAAAQAAAAAABAAaAH8AAQAAAAAABQAWABoAAQAAAAAABgANAEoAAQAAAAAACgA0AJkAAwABBAkAAQAaAAAAAwABBAkAAgAOAHEAAwABBAkAAwAaADAAAwABBAkABAAaAH8AAwABBAkABQAWABoAAwABBAkABgAaAFcAAwABBAkACgA0AJkAdwBlAGIAZgBsAG8AdwAtAGkAYwBvAG4AcwBWAGUAcgBzAGkAbwBuACAAMQAuADAAdwBlAGIAZgBsAG8AdwAtAGkAYwBvAG4Ac3dlYmZsb3ctaWNvbnMAdwBlAGIAZgBsAG8AdwAtAGkAYwBvAG4AcwBSAGUAZwB1AGwAYQByAHcAZQBiAGYAbABvAHcALQBpAGMAbwBuAHMARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('truetype'), url(data:application/font-woff;charset=utf-8;base64,d09GRk9UVE8AAAVcAAoAAAAABRQAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA9AAAAZMAAAGTuzUomU9TLzIAAAKIAAAAYAAAAGAOkgMtY21hcAAAAugAAABMAAAATBpVzFpnYXNwAAADNAAAAAgAAAAIAAAAEGhlYWQAAAM8AAAANgAAADYCkFKvaGhlYQAAA3QAAAAkAAAAJAdDA8lobXR4AAADmAAAACAAAAAgEgADXW1heHAAAAO4AAAABgAAAAYACFAAbmFtZQAAA8AAAAF7AAABe2TuiIBwb3N0AAAFPAAAACAAAAAgAAMAAAEABAQAAQEBDndlYmZsb3ctaWNvbnMAAQIAAQA6+BwC+BsD+BgEHgoACXf/i4seCgAJd/+LiwwHi0v6lPpUBR0AAACaDx0AAACfER0AAAAJHQAAAYoSAAkBAQ4bHR8iJywxNndlYmZsb3ctaWNvbnN3ZWJmbG93LWljb25zdTB1MXUyMHVFNjAwdUU2MDF1RTYwMnVFNjAzAAACAYkABgAIAQEEBwoNJDvH4P6UDv6UDv6UDvyUDvm0+FQV/FT4VEtL+BT8FPwU/BTLSwUO93T4VBX4VPhUy0v8FPwU+BT8FEtLBQ75tPlUFfzUiwV5i319i3kIi2sFi3mZfZ2LCPjUiwWdi5mZi50Ii6sFi519mXmLCIv7VBX81IsFeYt9fYt5CItrBYt5mX2diwj41IsFnYuZmYudCIurBYudfZl5iwiL+1QV/NSLBXmLfX2LeQiLawWLeZl9nYsI+NSLBZ2LmZmLnQiLqwWLnX2ZeYsIDvm4+SkV+6n7qvuq96ovLvgG/Bj4BvgYBQ76lBT6lBWLDAoAAAMEAAGQAAUAAAKZAswAAACPApkCzAAAAesAMwEJAAAAAAAAAAAAAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAQAAA5gMDwP/A/8ADwABAAAAAAQAAAAAAAAAAAAAAIAAAAAAAAgAAAAMAAAAUAAMAAQAAABQABAA4AAAACgAIAAIAAgABACDmA//9//8AAAAAACDmAP/9//8AAf/jGgQAAwABAAAAAAAAAAAAAAABAAH//wAPAAEAAAABAAC1pQTjXw889QALBAAAAAAAz/iHGQAAAADP+IcZAAAAAAOBA4AAAAAIAAIAAAAAAAAAAQAAA8D/wAAABAAAAAAAA4EAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAACAAAABAABIAQAAOAEAADABAAAnQAAUAAACAAAAAAADgCuAAEAAAAAAAEAGgAAAAEAAAAAAAIADgBxAAEAAAAAAAMAGgAwAAEAAAAAAAQAGgB/AAEAAAAAAAUAFgAaAAEAAAAAAAYADQBKAAEAAAAAAAoANACZAAMAAQQJAAEAGgAAAAMAAQQJAAIADgBxAAMAAQQJAAMAGgAwAAMAAQQJAAQAGgB/AAMAAQQJAAUAFgAaAAMAAQQJAAYAGgBXAAMAAQQJAAoANACZAHcAZQBiAGYAbABvAHcALQBpAGMAbwBuAHMAVgBlAHIAcwBpAG8AbgAgADEALgAwAHcAZQBiAGYAbABvAHcALQBpAGMAbwBuAHN3ZWJmbG93LWljb25zAHcAZQBiAGYAbABvAHcALQBpAGMAbwBuAHMAUgBlAGcAdQBsAGEAcgB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==) format('woff');
    font-weight: normal;
    font-style: normal;
  } */
  [class^="w-icon-"],
  [class*=" w-icon-"] {
    font-family: 'webflow-icons';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  /*full-calendar*/

  /* TODO: CSS copied from ~react-big-calendar/lib/css/react-big-calendar.css to solve a problem with the @import tag */

  .rbc-btn {
    color: inherit;
    font: inherit;
    margin: 0; }
  
  button.rbc-btn {
    overflow: visible;
    text-transform: none;
    -webkit-appearance: button;
    cursor: pointer; }
  
  button[disabled].rbc-btn {
    cursor: not-allowed; }
  
  button.rbc-input::-moz-focus-inner {
    border: 0;
    padding: 0; }
  
  .rbc-calendar {
    box-sizing: border-box;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch; }
  
  .rbc-calendar *,
  .rbc-calendar *:before,
  .rbc-calendar *:after {
    box-sizing: inherit; }
  
  .rbc-abs-full, .rbc-row-bg {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0; }
  
  .rbc-ellipsis, .rbc-event-label, .rbc-row-segment .rbc-event-content, .rbc-show-more {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }
  
  .rbc-rtl {
    direction: rtl; }
  
  .rbc-off-range {
    color: #999999; }
  
  .rbc-off-range-bg {
    background: #e6e6e6; }

  .rbc-off-range-bg.blocked {
    background:transparent url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKAgMAAADwXCcuAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAlQTFRFAAAAAAAAAAAAg2PpwAAAAAN0Uk5TIQAg+JfIwQAAABNJREFUeJxjYBANYEDHoVkL0DEAfN0I1QBhB+0AAAAASUVORK5CYII=') !important;
    background-repeat: repeat;    
  }

  .full-calendar.grey .rbc-off-range-bg.blocked {
    background:transparent url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKAgMAAADwXCcuAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAlQTFRFAAAAAAAAAAAAg2PpwAAAAAN0Uk5TTgBNiB9ZOQAAABNJREFUeJxjYBANYEDHoVkL0DEAfN0I1QBhB+0AAAAASUVORK5CYII=') !important;
    background-repeat: repeat;   
  }
  
  .full-calendar.dark .rbc-off-range-bg.blocked {
    background:transparent url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKAQMAAAC3/F3+AAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAZQTFRFgICAAAAA52irvgAAAAJ0Uk5TgABNEFVzAAAAEUlEQVR4nGNgP8CAjH4wICMAfIMIvPG+CVkAAAAASUVORK5CYII=') !important;
    background-repeat: repeat;    
  }

  .rbc-header {
    overflow: hidden;
    flex: 1 0 0%;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0 3px;
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
    font-size: 90%;
    min-height: 0;
    border-bottom: 1px solid #DDD; }
    .rbc-header + .rbc-header {
      border-left: 1px solid #DDD; }
    .rbc-rtl .rbc-header + .rbc-header {
      border-left-width: 0;
      border-right: 1px solid #DDD; }
    .rbc-header > a, .rbc-header > a:active, .rbc-header > a:visited {
      color: inherit;
      text-decoration: none; }
  
  .rbc-row-content {
    position: relative;
    user-select: none;
    -webkit-user-select: none;
    z-index: 4; }
  
  .rbc-today {
    background-color: #eaf6ff; }
  
  .rbc-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 10px;
    font-size: 16px; }
    .rbc-toolbar .rbc-toolbar-label {
      flex-grow: 1;
      padding: 0 10px;
      text-align: center; }
    .rbc-toolbar button {
      color: #373a3c;
      display: inline-block;
      margin: 0;
      text-align: center;
      vertical-align: middle;
      background: none;
      background-image: none;
      border: 1px solid #ccc;
      padding: .375rem 1rem;
      border-radius: 4px;
      line-height: normal;
      white-space: nowrap; }
      .rbc-toolbar button:active, .rbc-toolbar button.rbc-active {
        background-image: none;
        box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
        background-color: #e6e6e6;
        border-color: #adadad; }
        .rbc-toolbar button:active:hover, .rbc-toolbar button:active:focus, .rbc-toolbar button.rbc-active:hover, .rbc-toolbar button.rbc-active:focus {
          color: #373a3c;
          background-color: #d4d4d4;
          border-color: #8c8c8c; }
      .rbc-toolbar button:focus {
        color: #373a3c;
        background-color: #e6e6e6;
        border-color: #adadad; }
      .rbc-toolbar button:hover {
        color: #373a3c;
        background-color: #e6e6e6;
        border-color: #adadad; }
  
  .rbc-btn-group {
    display: inline-block;
    white-space: nowrap; }
    .rbc-btn-group > button:first-child:not(:last-child) {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0; }
    .rbc-btn-group > button:last-child:not(:first-child) {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0; }
    .rbc-rtl .rbc-btn-group > button:first-child:not(:last-child) {
      border-radius: 4px;
      border-top-left-radius: 0;
      border-bottom-left-radius: 0; }
    .rbc-rtl .rbc-btn-group > button:last-child:not(:first-child) {
      border-radius: 4px;
      border-top-right-radius: 0;
      border-bottom-right-radius: 0; }
    .rbc-btn-group > button:not(:first-child):not(:last-child) {
      border-radius: 0; }
    .rbc-btn-group button + button {
      margin-left: -1px; }
    .rbc-rtl .rbc-btn-group button + button {
      margin-left: 0;
      margin-right: -1px; }
    .rbc-btn-group + .rbc-btn-group,
    .rbc-btn-group + button {
      margin-left: 10px; }
  
  .rbc-event {
    border: none;
    box-sizing: border-box;
    box-shadow: none;
    margin: 0;
    padding: 2px 5px;
    background-color: #3174ad;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    width: 100%;
    text-align: left; 
    display: flex !important; 
    flex-direction: column-reverse !important;
    justify-content: flex-end;}
    .rbc-slot-selecting .rbc-event {
      cursor: inherit;
      pointer-events: none; }
  
  .rbc-event-label {
    font-size: 80%; }
  
  .rbc-event-overlaps {
    box-shadow: -1px 1px 5px 0px rgba(51, 51, 51, 0.5); }
  
  .rbc-event-continues-prior {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; }
  
  .rbc-event-continues-after {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0; }
  
  .rbc-event-continues-earlier {
    border-top-left-radius: 0;
    border-top-right-radius: 0; }
  
  .rbc-event-continues-later {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0; }
  
  .rbc-row {
    display: flex;
    flex-direction: row; }
  
  .rbc-row-segment {
    padding: 0 1px 1px 1px; }
  
  .rbc-selected-cell {
    background-color: rgba(0, 0, 0, 0.1); }
  
  .rbc-show-more {
    background-color: rgba(255, 255, 255, 0.3);
    z-index: 4;
    font-weight: bold;
    font-size: 85%;
    height: auto;
    line-height: normal; }
  
  .rbc-month-view {
    position: relative;
    border: 1px solid #DDD;
    display: flex;
    flex-direction: column;
    flex: 1 0 0;
    width: 100%;
    user-select: none;
    -webkit-user-select: none;
    height: 100%; 
    border-radius: 6px;}
  
  .rbc-month-header {
    display: flex;
    flex-direction: row; }
  
  .rbc-month-row {
    display: flex;
    position: relative;
    flex-direction: column;
    flex: 1 0 0;
    flex-basis: 0px;
    overflow: hidden;
    }
    
    .rbc-month-row + .rbc-month-row {
      border-top: 1px solid #DDD; }
  
  .rbc-date-cell {
    flex: 1 1 0;
    min-width: 0;
    padding: 5px 5px 0px 0px;
    text-align: right; }

    .rbc-date-cell.rbc-now span {
      border:1px solid #0093C9;
      border-radius: 50%;
      background-color: #0093C9;
      color: white;
      
      padding: .2rem;
      font-weight: bold;
     }
    .rbc-date-cell > a, .rbc-date-cell > a:active, .rbc-date-cell > a:visited {
      color: inherit;
      text-decoration: none; }
  
  .rbc-row-bg {
    display: flex;
    flex-direction: row;
    flex: 1 0 0;
    overflow: hidden; }
  
  .rbc-day-bg {
    flex: 1 0 0%; }
    .rbc-day-bg + .rbc-day-bg {
      border-left: 1px solid #DDD; }
    .rbc-rtl .rbc-day-bg + .rbc-day-bg {
      border-left-width: 0;
      border-right: 1px solid #DDD; }
  
  .rbc-overlay {
    position: absolute;
    z-index: 5;
    border: 1px solid #e5e5e5;
    background-color: #fff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.25);
    padding: 10px; }
    .rbc-overlay > * + * {
      margin-top: 1px; }
  
  .rbc-overlay-header {
    border-bottom: 1px solid #e5e5e5;
    margin: -10px -10px 5px -10px;
    padding: 2px 10px; }
  
  .rbc-agenda-view {
    display: flex;
    flex-direction: column;
    flex: 1 0 0;
    overflow: auto; }
    .rbc-agenda-view table.rbc-agenda-table {
      width: 100%;
      border: 1px solid #DDD;
      border-spacing: 0;
      border-collapse: collapse; }
      .rbc-agenda-view table.rbc-agenda-table tbody > tr > td {
        padding: 5px 10px;
        vertical-align: top; }
      .rbc-agenda-view table.rbc-agenda-table .rbc-agenda-time-cell {
        padding-left: 15px;
        padding-right: 15px;
        text-transform: lowercase; }
      .rbc-agenda-view table.rbc-agenda-table tbody > tr > td + td {
        border-left: 1px solid #DDD; }
      .rbc-rtl .rbc-agenda-view table.rbc-agenda-table tbody > tr > td + td {
        border-left-width: 0;
        border-right: 1px solid #DDD; }
      .rbc-agenda-view table.rbc-agenda-table tbody > tr + tr {
        border-top: 1px solid #DDD; }
      .rbc-agenda-view table.rbc-agenda-table thead > tr > th {
        padding: 3px 5px;
        text-align: left;
        border-bottom: 1px solid #DDD; }
        .rbc-rtl .rbc-agenda-view table.rbc-agenda-table thead > tr > th {
          text-align: right; }
  
  .rbc-agenda-time-cell {
    text-transform: lowercase; }
    .rbc-agenda-time-cell .rbc-continues-after:after {
      content: ' »'; }
    .rbc-agenda-time-cell .rbc-continues-prior:before {
      content: '« '; }
  
  .rbc-agenda-date-cell,
  .rbc-agenda-time-cell {
    white-space: nowrap; }
  
  .rbc-agenda-event-cell {
    width: 100%; }
  
  .rbc-time-column {
    display: flex;
    flex-direction: column;
    min-height: 100%; }
    .rbc-time-column .rbc-timeslot-group {
      flex: 1; }
  
  .rbc-timeslot-group {
    border-bottom: 1px solid #DDD;
    min-height: 40px;
    display: flex;
    flex-flow: column nowrap; }
  
  .rbc-time-gutter,
  .rbc-header-gutter {
    flex: none; }
  
  .rbc-label {
    padding: 0 5px; }
  
  .rbc-day-slot {
    position: relative; }
    .rbc-day-slot .rbc-events-container {
      bottom: 0;
      left: 0;
      position: absolute;
      right: 0;
      margin-right: 10px;
      top: 0; }
      .rbc-day-slot .rbc-events-container.rbc-rtl {
        left: 10px;
        right: 0; }
    .rbc-day-slot .rbc-event {
      border: 1px solid #265985;
      display: flex;
      max-height: 100%;
      min-height: 20px;
      align-items: flex-start;
      overflow: hidden;
      position: absolute; }
    .rbc-day-slot .rbc-event-label {
      flex: none;
      padding-right: 5px;
      width: auto; }
    .rbc-day-slot .rbc-event-content {
      width: 100%;
      word-wrap: break-word;
      line-height: 18px;
      min-height: 1em; }
    .rbc-day-slot .rbc-time-slot {
      border-top: 0px !important  }
  
  .rbc-time-view-resources .rbc-time-gutter,
  .rbc-time-view-resources .rbc-time-header-gutter {
    position: sticky;
    left: 0;
    background-color: white;
    border-right: 1px solid #DDD;
    z-index: 10;
    margin-right: -1px; }
  
  .rbc-time-view-resources .rbc-time-header {
    overflow: hidden; }
  
  .rbc-time-view-resources .rbc-time-header-content {
    min-width: auto;
    flex: 1 0 0;
    flex-basis: 0px; }
  
  .rbc-time-view-resources .rbc-time-header-cell-single-day {
    display: none; }
  
  .rbc-time-view-resources .rbc-day-slot {
    min-width: 140px; }
  
  .rbc-time-view-resources .rbc-header,
  .rbc-time-view-resources .rbc-day-bg {
    width: 140px;
    flex: 1 1 0;
    flex-basis: 0 px; }
  
  .rbc-time-header-content + .rbc-time-header-content {
    margin-left: -1px; }
  
  .rbc-time-slot {
    flex: 1 0 0; }
    .rbc-time-slot.rbc-now {
      font-weight: bold; }
  
  .rbc-day-header {
    text-align: center; }
  
  .rbc-slot-selection {
    z-index: 10;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.5);
    color: white;
    font-size: 75%;
    width: 100%;
    padding: 3px; }
  
  .rbc-slot-selecting {
    cursor: move; }
  
  .rbc-time-view {
    display: flex;
    flex-direction: column;
    flex: 1;
    width: 100%;
    border: 1px solid #DDD;
    min-height: 0; 
    border-radius: 6px;
  }
    .rbc-time-view .rbc-time-gutter {
      white-space: nowrap; }
    .rbc-time-view .rbc-allday-cell {
      box-sizing: content-box;
      width: 100%;
      height: 100%;
      position: relative; }
    .rbc-time-view .rbc-allday-cell + .rbc-allday-cell {
      border-left: 1px solid #DDD; }
    .rbc-time-view .rbc-allday-events {
      position: relative;
      z-index: 4; }
    .rbc-time-view .rbc-row {
      box-sizing: border-box;
      min-height: 20px; }
  
  .rbc-time-header {
    display: flex;
    flex: 0 0 auto;
    flex-direction: row; }
    .rbc-time-header.rbc-overflowing {
      border-right: 1px solid #DDD; }
    .rbc-rtl .rbc-time-header.rbc-overflowing {
      border-right-width: 0;
      border-left: 1px solid #DDD; }
    .rbc-time-header > .rbc-row:first-child {
      border-bottom: 1px solid #DDD; }
    .rbc-time-header > .rbc-row.rbc-row-resource {
      border-bottom: 1px solid #DDD; }
  
  .rbc-time-header-cell-single-day {
    display: none; }
  
  .rbc-time-header-content {
    flex: 1;
    display: flex;
    min-width: 0;
    flex-direction: column;
    border-left: 1px solid #DDD; }
    .rbc-rtl .rbc-time-header-content {
      border-left-width: 0;
      border-right: 1px solid #DDD; }
    .rbc-time-header-content > .rbc-row.rbc-row-resource {
      border-bottom: 1px solid #DDD;
      flex-shrink: 0; }
  
  .rbc-time-content {
    display: flex;
    flex: 1 0 0%;
    align-items: flex-start;
    width: 100%;
    border-top: 2px solid #DDD;
    overflow-y: auto;
    position: relative; }
    .rbc-time-content > .rbc-time-gutter {
      flex: none; }
    .rbc-time-content > * + * > * {
      border-left: 1px solid #DDD; }
    .rbc-rtl .rbc-time-content > * + * > * {
      border-left-width: 0;
      border-right: 1px solid #DDD; }
    .rbc-time-content > .rbc-day-slot {
      width: 100%;
      user-select: none;
      -webkit-user-select: none; }
  
  .rbc-current-time-indicator {
    position: absolute;
    z-index: 3;
    left: 0;
    right: 0;
    height: 1px;
    background-color: #74ad31;
    pointer-events: none; }

  /* End of ~react-big-calendar/lib/css/react-big-calendar.css */

  .MuiIconButton-root {
    padding: 9px !important;
  }

  .MuiIconButton-root:hover {
    background-color: transparent!important;
  }

  .MuiButton-outlined.grey,
  .MuiIconButton-root.grey,
  .MuiSelect-select.grey,
  .MuiOutlinedInput-root.grey .Mui-focused {
    background: inherit;
    color: #fff;
  }

  .MuiButton-outlined.dark,
  .MuiIconButton-root.dark,
  .MuiSelect-select.dark,
  .MuiOutlinedInput-root.dark .Mui-focused {
    background: inherit; 
    color: #fff; 
  }

  .MuiSelect-icon.grey,
  .MuiSelect-icon.dark {
    background: inherit;
    color: #fff;
  }

  .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline {
    border-color: #ddd !important;
   }

  .MuiOutlinedInput-root.dark .MuiOutlinedInput-notchedOutline {
    border-color: #444 !important;
  }

  .MuiOutlinedInput-root.grey .MuiOutlinedInput-notchedOutline {
    border-color: #ddd !important;
  }

  .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
    border-color: inherit !important;
    border-width: 1px !important;
  }

  .MuiOutlinedInput-root.dark.Mui-focused .MuiOutlinedInput-notchedOutline {
    border-color: #444 !important;
    border-width: 1px !important;
  }

  .MuiOutlinedInput-root.grey.Mui-focused .MuiOutlinedInput-notchedOutline {
    border-color: #ddd !important;
    border-width: 1px !important;
  }

  .full-calendar
  {
    margin-top: 15px;
    padding: 2px 5px;
  }

  .rbc-toolbar .rbc-toolbar-label {
    flex-grow: 0;
    text-align: left;
    margin-left: 10px;
  }

  .full-calendar .rbc-off-range-bg {
    background: #eeeeee;
  }

  .full-calendar.grey .rbc-off-range-bg {
    background: #616161;
  }

  .full-calendar.dark .rbc-off-range-bg {
    background: #424242;
  }

  .full-calendar .rbc-today {
    /* background: #eaf6ff; */
    background: inherit;
  }

  .rbc-date-cell {
    margin-top: 3px; 
  }

  .rbc-date-cell.rbc-now  > a, .rbc-date-cell > a:active, .rbc-date-cell > a:visited {
    background: #0093C9;
    color: white;
    border-radius: 100px;
    padding: 0.2rem;
  }

  .full-calendar.grey .rbc-today > a {
    background: #0093C9;
    color: white;
    border-radius: 100px;
    padding: 0.2rem;
  }

  /* .full-calendar.grey .rbc-today {
    background: #878787;
  }

  .full-calendar.dark .rbc-today {
    background: #262626;
  } */

  .rbc-toolbar button {
    color: inherit;
  }

  .rbc-toolbar .rbc-toolbar-label {
    font-size: 1.35em;
    font-weight: 500;
  }

  .full-calendar .rbc-calendar .rbc-month-view {
    display: block;
  }

  .full-calendar .rbc-calendar .rbc-row-content {
    height: calc(calc(100vh - 350px)/6);
    height: calc(calc(var(--app-height) - 350px)/6);
    min-height: 80px;
  }

  .modal-content .full-calendar .rbc-calendar .rbc-row-content {
    height: calc(calc(100vh - 500px)/6);
    height: calc(calc(var(--app-height) - 500px)/6);
    max-height: 120px;
  }

  .full-calendar .rbc-allday-cell {
    max-height: 80px;
  }

  .fullcalendar-legend {
    max-width: 90%;
    margin-top: 5px;
    padding-left: 5px;
  }
 
  .fullcalendar-legend ul {
    margin: 0;
    margin-bottom: 5px;
    padding: 0;
    float: left;
    list-style: none;
  }

  .fullcalendar-legend ul li {
    font-weight: bold;
    list-style: none;
    margin-left: 0;
    line-height: 18px;
    margin-bottom: 2px;
    display: block;
    float: left;
    margin-right: 10px;
  }

  .fullcalendar-legend ul li span {
    display: block;
    float: left;
    height: 16px;
    width: 30px;
    margin-right: 5px;
    margin-left: 0;
    border-width: 0;
    border-radius: 5px;
  }

  .dropzone-input * {
    cursor: pointer !important;
  }
  .dropzone-input svg {
    color: rgba(0, 0, 0, 0.54);
  }
  .dropzone-input input {
    margin-top: 5px;
    font-size: 14px;
  }
  .dropzone-input.grey svg {
    fill: #ccc !important;
  }
  .dropzone-input.dark svg {
    fill: #999 !important;
  }

  /* .w-icon-slider-right:before {
    content: "\e600";
  } */
  /* .w-icon-slider-left:before {
    content: "\e601";
  } */
  .w-icon-nav-menu:before {
    content: "\e602";
  }
  .w-icon-arrow-down:before,
  .w-icon-dropdown-toggle:before {
    content: "\e603";
  }
  .w-form {
    margin: 0 0 15px;
  }  
  .w-inline-block {
    max-width: 100%;
    display: inline-block;
  }
  .w-hidden {
    display: none;
  }
  .w-input,
  .w-select {
    display: block;
    width: 100%;
    height: 38px;
    padding: 8px 12px;
    margin-bottom: 10px;
    font-size: 13px;
    line-height: 1.428571429;
    color: #536372;
    vertical-align: middle;
    background-color: #ffffff;
    border: 1px solid #CBD0D4;
  }
  .w-select:focus {
    background: none !important;
  }
  .w-select.dark:focus {
    background: #000 !important;
  }
  .w-select.grey:focus {
    background-color: #333 !important;
  }
  .w-select:not(.dark):not(.grey) option:disabled {
    color: #ccc;
  }
  .w-underline {
    width: 100%;
    display: block;
    background-image: linear-gradient(#fff,#f3f3f3);
    height: 30px;
  }
  .w-underline.dark{
    background-image: none;
    background-color: #000;
  }
  .w-underline::after {
    border-bottom: none !important;
  }
  .w-underline:hover {
    border-bottom: none !important;
  }
  .w-underline:before {
    border-bottom: none !important;
  }
  .w-input:-moz-placeholder,
  .w-select:-moz-placeholder {
    color: #999;
  }
  .w-input::-moz-placeholder,
  .w-select::-moz-placeholder {
    color: #999;
    opacity: 1;
  }
  .w-input:-ms-input-placeholder,
  .w-select:-ms-input-placeholder {
    color: #999;
  }
  .w-input::-webkit-input-placeholder,
  .w-select::-webkit-input-placeholder {
    color: #999;
  }
  
  .w-input:focus,
  .w-select:focus,
  .textarea-input:focus,
  .text-field:focus {
    outline: 0;
  }

  .w-input[disabled],
  .w-input[readonly],
  .w-select[disabled],
  .w-select.readonly,
  fieldset[disabled] .w-input,
  fieldset[disabled] .w-select,
  .mui-datepicker[readonly],
  .mui-datepicker.readonly,
  .dropzone-input.readonly,
  .textarea-input[readonly] {
    background-color: #eeeeee;
    color: #999 !important;
    cursor: default;
  }

  .mui-datepicker[readonly] input {
    color: #999 !important;
  }

  .mui-datepicker.readonly input {
    -webkit-text-fill-color: #999;
  }

  .dropzone-input.readonly * {
    cursor: default !important;
  }

  .dropzone-input.readonly input {
    color: #999 !important
  }

  textarea.w-input,
  textarea.w-select {
    height: auto;
  }
  .w-select {
    background-color: #f3f3f3;
  }
  .w-select[multiple] {
    height: auto;
  }
  .w-form-label {
    display: inline-block;
    cursor: pointer;
    font-weight: normal;
    margin-bottom: 0px;
    font-size: 14px;
  }
  .w-checkbox,
  .w-radio {
    display: block;
    margin-bottom: 5px;
    padding-right: 20px;
  }
  .w-checkbox:before,
  .w-radio:before,
  .w-checkbox:after,
  .w-radio:after {
    content: " ";
    display: table;
  }
  .w-checkbox:after,
  .w-radio:after {
    clear: both;
  }
  .w-checkbox-input,
  .w-radio-input {
    margin: 4px 0 0;
    margin-top: 1px \9;
    line-height: normal;
    float: left;
    margin-left: -20px;
  }
  .w-radio-input {
    margin-top: 3px;
  }
.w-slider2 {
    position: relative;
    height: 40vh;
    text-align: center;
    background-color: transparent;
    clear: both;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    tap-highlight-color: rgba(0, 0, 0, 0);
}
  .w-slider-mask {
    position: relative;
    display: block;
    z-index: 1;
    left: 0;
    right: 0;
    height: 100%;
    white-space: nowrap;
    border-radius: 25px;
  }
  .w-slide {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 100%;
    height: 100%;
    white-space: normal;
    text-align: left;
    background-color: #fff;
  }

  .w-slide.dark {
    background-color: #000;
  }

  .w-slide.grey {
    background-color: #000;
  }

  .w-slider-nav {
    position: absolute;
    z-index: 2;
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    padding-top: 10px;
    height: 40px;
    text-align: center;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    tap-highlight-color: rgba(0, 0, 0, 0);
  }
  .w-slider-nav.w-round > div {
    border-radius: 100%;
  }
  .w-slider-nav.w-num > div {
    width: auto;
    height: auto;
    padding: 0.2em 0.5em;
    font-size: inherit;
    line-height: inherit;
  }
  .w-slider-nav.w-shadow > div {
    box-shadow: 0 0 3px rgba(51, 51, 51, 0.4);
  }
  .w-slider-nav-invert {
    color: #fff;
  }
  .w-slider-nav-invert > div {
    background-color: rgba(34, 34, 34, 0.4);
  }
  .w-slider-nav-invert > div.w-active {
    background-color: #222;
  }
  .w-slider-dot {
    position: relative;
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: rgba(255, 255, 255, 0.4);
    cursor: pointer;
    margin: 0 3px 0.5em;
    transition: background-color 100ms, color 100ms;
  }
  .w-slider-dot.w-active {
    background-color: #fff;
  }
  .w-slider-arrow-left,
  .w-slider-arrow-right {
    position: absolute;
    width: 80px;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    cursor: pointer;
    overflow: hidden;
    color: white;
    font-size: 40px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
  .w-slider-arrow-left [class^="w-icon-"],
  .w-slider-arrow-right [class^="w-icon-"],
  .w-slider-arrow-left [class*=" w-icon-"],
  .w-slider-arrow-right [class*=" w-icon-"] {
    position: absolute;
  }
  .w-slider-arrow-left {
    z-index: 3;
    right: auto;
  }
  .w-slider-arrow-right {
    z-index: 4;
    left: auto;
  }
  .w-icon-slider-left,
  .w-icon-slider-right {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 1em;
    height: 1em;
  }
  .loadable {
    height: 100%;
  }
  .w-tabs {
    position: relative;
    width: calc(100% - 8px);
    height: 100%;
  }
  .w-tabs:before, 
  .w-tabs:after {
    content: " ";
    display: table;
  }
  .w-tabs:after {
    clear: both;
  }
  .w-tab-menu {
    position: relative;
    border-bottom: #DDD 1px solid;
  }
  .w-tab-link {
    position: relative;
    display: inline-block;
    vertical-align: top;
    text-decoration: none;
    padding: 9px 30px;
    text-align: left;
    cursor: pointer;
  }
  /* .w-tab-link.w--current {
    background-color: #C8C8C8;
  } */
  .w-tab-content {
    position: relative;
    display: block;
    overflow: hidden;
  }
  .w-list-unstyled {
    padding-left: 0;
    list-style: none;
  }
  .w--tab-active {
    display: block;
  }
  .w-ix-emptyfix:after {
    content: "";
  }

  
  /* MATERIAL UI */

  .mui-checkbox {
    color: #5a5a5a !important;
    width: 36px !important;
  }
  .mui-checkbox-disabled {
    color: #c0c0c0 !important;
    cursor: default !important;
  }
  /* .mui-checkbox.blue {
    color: #09c !important;
  } */
  .mui-checkbox.dark{
    color: #ddd !important;
  }
  .mui-checkbox-disabled.dark {
    color: #5a5a5a !important;
  }
  /* .mui-checkbox.green{
    color: #018748 !important;
  } */
  .mui-checkbox.grey {
    color: #f2f2f2 !important;
  }

.mui-multi-container {
    width: 100%;
    height: 40px;
    min-width: 200px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    border: 1px solid #ddd;
    padding: 0 5px 0 5px;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1.428571429;
    vertical-align: middle;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    scrollbar-width: thin;
}

.mui-multi-container > input:not([disabled]) {
    min-width: 150px;
    font-size: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 25px;
    padding-left: 5px;
}

.mui-multi-container::-webkit-scrollbar {
    height: 5px;
}

.mui-multi-container::-webkit-scrollbar-track {
    background: transparent;
}

.mui-multi-container::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 5px;
}

.mui-multi-container::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.mui-multi-container:hover:not(.readonly) {
    border-color: #254fb7;
}

.mui-multi-container:before {
    border-bottom: none !important;
}

.mui-multi-container:after {
    border-bottom: none !important;
}

.mui-multi-container.dark {
    background-color: #111;
    color: #ccc;
    border-color: #444;
}

.mui-multi-container.grey {
    background-color: rgba(0,0,0,0.2);
    color: #fff;
    border-color: #666;
}


.normal-label {
    text-decoration: none;
    text-transform: none;
}

.tab-link-pop {
  padding: 9px 10px 0px 10px;
  background-color: #fff;
  color: #666666;
  transition: color 0.2s ease;
}

.tab-link-pop div {
  padding-bottom: 8px;
}

.tab-link-pop.w--current {
  color: #0093C9;
}

.tab-link-pop.w--current div {
  border-bottom: 2px solid #0093C9;
}

.tab-link-pop:hover:not(.disabled):not(.w--current) {
  color: #0093C9;
  background-color: #e6f7ff;
}

.tab-link-pop.disabled {
  cursor: not-allowed;
}

.w-tab-menu { 
  border-bottom: 0px;
  margin-bottom: 5px;
  margin-left: -10px;
  font-size: 15px;
}


.w-tab-menu.grey .tab-link-pop {
  background-color: #424242;
}

.w-tab-menu.grey .tab-link-pop.w--current div{
  color: #FFF;
  border-bottom: 2px solid #FFF;
}

.w-tab-menu.dark .tab-link-pop{
  background-color: #222;
}

.w-tab-menu.dark .tab-link-pop.w--current div{
  color: #FFF;
  border-bottom: 2px solid #fff;
}

.slideOutForm .w-tab-menu.dark .tab-link-pop, 
.slideOutForm .w-tab-menu.grey .tab-link-pop {
  color: #0093C9;
  background-color: #323232;
} 

.MuiPickersDay-daySelected:hover {
  background-color: #3f51b5 !important;
  color: #fff !important;
}

.rbc-event-allday.holiday-event { 
  margin-top: -25px;
  z-index: -1;
  position: relative;
}

.holiday-title {
  display: inline-block;
  padding-top: 3px;
}

.rbc-eventIcon img + span {
  margin-left: 5px;
}

.holiday-title span:last-child {
  /* display: inline-block;
  position: absolute;
  margin-left: 5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; 
  width: 50%;*/
  padding-right: 10px; 
  vertical-align: top;
}

.rbc-allday-cell>div.rbc-row-content>div>div>div{
  margin-top:0;
} 

.full-calendar.grey .MuiIconButton-root.Mui-disabled,
.full-calendar.dark .MuiIconButton-root.Mui-disabled {
  color: #999 !important;
}

.blade-content .MuiGridList-root {
  padding: 0px 15px !important;
}

.blade-content .MuiGridList-root:not(.gridResponsive) {
  min-width: 1000px;
}
.blade-content .MuiGridList-root.gridCols-2:not(.gridResponsive) {
  min-width: 300px;
}
.blade-content .MuiGridList-root.gridCols-3:not(.gridResponsive) {
  min-width: 450px;
}
.blade-content .MuiGridList-root.gridCols-4:not(.gridResponsive) {
  min-width: 600px;
}
.blade-content .MuiGridList-root.gridCols-5:not(.gridResponsive) {
  min-width: 750px;
}
.blade-content .MuiGridList-root.gridCols-6:not(.gridResponsive) {
  min-width: 900px;
}

.mui-gridItem {
  box-shadow: 0px 1.6px 3.6px rgba(0, 0, 0, 0.13), 0px 0px 2.9px rgba(0, 0, 0, 0.11);
  border-radius: 6px;
  margin: 4px;
}

.mui-gridItem:hover {
  box-shadow: 0px 1.6px 3.6px rgba(60, 64, 67, 0.4), 0px 0px 2.9px rgba(60, 64, 67, 0.4);
}

.mui-gridItem:hover, .mui-gridItem.selectedGridTile {
  filter: brightness(105%);  
}

.mui-gridItem .gridItemBg {
  background-size: cover;
  background-position: center;
  background-color: #f1f1f1;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
}

.mui-gridItem.grey .gridItemBg {
  background-color: #4c4c4c;
}

.mui-gridItem.dark .gridItemBg {
  background-color: #2c2c2c;
}

.mui-gridItem.selectedGridTile {
  filter: brightness(110%);
}

.mui-gridItem .MuiGridListTile-tile {
  border-radius: 6px;
}

.mui-gridItem.grey .MuiGridListTile-tile {
  background-color: #555;
}

.mui-gridItem.dark .MuiGridListTile-tile {
  background-color: #333;
}

.mui-gridItem.grey .MuiGridListTile-tile:hover, .mui-gridItem.dark .MuiGridListTile-tile:hover,
.mui-gridItem.grey.selectedGridTile .MuiGridListTile-tile, .mui-gridItem.dark.selectedGridTile .MuiGridListTile-tile {
  filter: brightness(105%);  
  box-shadow: 0px 1.6px 3.6px rgba(255,255,255,0.2), 0px 0px 2.9px rgba(255,255,255,0.2);
}

.mui-gridItem .tileContentWrapper {
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  flex-direction: column;
  height: 100%;
}

.mui-gridItem .tileContent {
  width: 100%;
}

.mui-gridItem.withDetails .tileContentWrapper {
  padding-bottom: 10px;
}

.mui-gridItem.withActions.withDetails:not(.showDetailsOnHover) .tileContentWrapper {
  padding-bottom: 10px;
}

.mui-gridItem.showDetailsOnHover .tileContentWrapper {
  padding-bottom: 15px;
}

.mui-gridItem .gridTileBlackFade{
  display: none;
}

.showDetailsOnHover .MuiGridListTile-tile:hover .gridTileBlackFade {
  display: block;
  position: absolute;
  top: 0px;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(145deg, #000 5%, rgba(255, 255, 255, 0) 80%), linear-gradient(300deg, rgba(0, 0, 0, 0.9) 4%, rgba(255, 255, 255, 0) 133%);
}

.mui-gridItem.showDetailsOnHover .tileMainText, 
.mui-gridItem.showDetailsOnHover .tileDetails {
  display: none;
}

.showDetailsOnHover .MuiGridListTile-tile:hover .tileContent:first-child {
  position: absolute;
  z-index: -1;
}

.showDetailsOnHover .MuiGridListTile-tile:hover .tileDetails {
  margin-top: unset;
  display: flex;
}

.mui-gridItem .tileContent:not(:first-child) {
  padding: 0px 15px;
}

.mui-gridItem:not(.showDetailsOnHover) .tileMainText {
  overflow: hidden;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  font-size: 16px;
  line-height: 25px;
  margin: 15px 0px 5px 0px;
  word-break: break-word;
}

.mui-gridItem.showDetailsOnHover:hover .tileMainText  {
  display: block;
}

.mui-gridItem.showDetailsOnHover:hover .tileMainText span {
  padding-top: 15px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: block;
}

.mui-gridItem .tileMainText img {
  max-width: 20px;
  max-height: 20px;
  margin: 3px 5px 0px 0px;
  float: left;
} 

.mui-gridItem .tileControls {
  width: 100%;
}

.mui-gridItem .tileControls .tileSubText  {
  font-size: 95%;
  margin-top: 5px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  -webkit-line-clamp: 1;
}

.mui-gridItem:not(.showDetailsOnHover).withActions .tileControls .tileSubText:last-child {
  width: calc(100% - 35px);
}

.mui-gridItem .tileContent:not(.tileMainText) {
  color: #757575 !important;
}

.mui-gridItem.grey .tileContent:not(.tileMainText) {
  color: #CCC !important;
}

.mui-gridItem.dark .tileContent:not(.tileMainText) {
  color: #999 !important;
}


.mui-gridItem.showDetailsOnHover:hover .tileContent:not(.tileMainText) *:not(.badge) {
  color: #CCC !important;
}

.mui-gridItem.showDetailsOnHover:hover .tileContent.tileMainText * {
  color: #EEE !important;
}

.mui-gridItem .badge {
  padding: 3px 7px;
}

.showDetailsOnHover .tileContentWrapper .actionsDialogMenu a {
  background-color: rgba(0, 0, 0, 0.4) !important;
}

.showDetailsOnHover .tileContentWrapper .actionsDialogMenu a:hover {
  background-color: rgba(255, 255, 255, 0.4) !important;
}

.showDetailsOnHover .tileContentWrapper .actionsDialogMenu a svg {
  fill: #EEE !important;
}

.showDetailsOnHover .tileContentWrapper  {
  overflow-y: auto;
  max-height: 100%;
}

.showDetailsOnHover .tileContentWrapper::-webkit-scrollbar {
  width: 3px;
}

.mui-gridItem .tileDetails {
  margin-top: auto;
}

.mui-gridItem .tileFooter {
  position: absolute;
  bottom: 0px;
}

.mui-gridItem .actionsDialogMenu {
  width: 30px;
  margin: unset;
  position: absolute;
  right: 8px;
  bottom: 1px;
}

.mui-gridItem .actionsDialogMenu .q-link {
  height: 28px;
  border-radius: 6px;
}
.MessageCenter{
  background-color: rgb(228, 19, 19);
  width: 30px;
  Height: 30px;
  border-radius: 100%;
  color:#fff;
  padding: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 10px;
  margin-left: 10px;
}

.MessageCenterSVG{
  width: 40px;
  Height: 40px;
  color:#fff;
  padding: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 10px;
  margin-left: 10px;
}


:root {
    --app-height: 100vh;
}

html {
    height: 100%;
}

    html[data-w-dynpage] [data-w-cloak] {
        color: transparent !important;
    }

body {
    background-color: #fff;
    font-family: Roboto, "Open Sans", RobotoDraft, Helvetica, Arial, sans-serif !important;
    color: #333;
    line-height: 1.4em;
    display: flex;
    flex-direction: column;
    margin: 0;
    height: 100vh;
    height: var(--app-height);
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.mobileOnly {
    display: none !important;
}

.w-mod-js:not(.w-mod-touch) .touchDevices {
    display: none !important;
}

.w-mod-js.w-mod-touch .pointerDevices {
    display: none !important;
}

img {
    vertical-align: middle;
    display: inline-block;
    max-width: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: bold;
    margin-bottom: 10px;
}

h1 {
    font-size: 38px;
    line-height: 44px;
    margin-top: 20px;
}

h2 {
    font-size: 32px;
    line-height: 36px;
    margin-top: 20px;
}

h3 {
    font-size: 24px;
    line-height: 30px;
    margin-top: 20px;
}

h4 {
    font-size: 18px;
    line-height: 24px;
    margin-top: 10px;
}

h5 {
    font-size: 14px;
    line-height: 20px;
    margin-top: 10px;
}

h6 {
    font-size: 13px;
    line-height: 18px;
    margin-top: 10px;
}

p {
    margin-top: 0;
    margin-bottom: 10px;
}

blockquote {
    margin: 0 0 10px 0;
    padding: 10px 20px;
    border-left: 5px solid #E2E2E2;
    font-size: 18px;
    line-height: 22px;
}

figure {
    margin: 0;
    margin-bottom: 10px;
}

figcaption {
    margin-top: 5px;
    text-align: center;
}

ul {
    padding-left: 20px;
}

ul,
ol {
    margin-top: 0px;
    margin-bottom: 10px;
    padding-left: 40px;
}

fieldset {
    padding: 0;
    margin: 0;
    border: 0;
}

button,
html input[type="button"],
input[type="reset"] {
    border: 0;
    cursor: pointer;
    -webkit-appearance: button;
}

label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}

/*############*/

h2 {
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 1.5em;
    line-height: 36px;
    font-weight: 400;
}
.bladeHeight{
    height:335px;
}
a {
    color: #0093C9;
    font-weight: 700;
    text-decoration: none;
    font-size:14px;
}

input[type=text]::-ms-clear {
    display: none;
    width: 0;
    height: 0;
}

input[type=text]::-ms-reveal {
    display: none;
    width: 0;
    height: 0;
}

pre.field-text {
    margin-top: 0px;
    margin-bottom: 0px;
    font: unset;
}

    pre.field-text.json {
        max-width: none;
    }

.header {
    position: static;
    left: 0px;
    top: 0px;
    right: 0px;
    z-index: 11;
    display: flex;
    justify-content: space-between;
    overflow: visible;
    width: 100%;
    height: 40px;
    border-bottom: 1px solid #ddd;
    background-color: #FFFFFF;
    color: #36434E;
}

    .header.dark {
        border-bottom: 1px solid #444;
        background-color: #1c1c1c;
        opacity: 1;
    }

    .header.green {
        border-bottom: 1px solid #018748;
        background-color: #018748;
    }

    .header.grey {
        border-bottom: 1px solid #555;
        background-color: #1a1a1a;
    }

    .header.blue {
        border-bottom: 1px solid #007FAD;
        background-color: #007FAD;
    }

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

    .header .kubra-title {
        display: inline-block;
    }

.header .kubra-client-nav {
    width: 65%;
    margin-left: 40px;
    border-left: #ddd 1px solid;
}

    .header.grey .kubra-client-nav,
    .header.dark .kubra-client-nav {
        border-left: #666 1px solid;
    }


.popup-app ~ .header,
.popup-blade ~ .header {
    z-index: 15;
}

.menu-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-bottom: 0px;
    padding-top: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    background-color: #536372;
    height: calc(100vh - 90px);
    height: calc(var(--app-height) - 90px);
}

    .menu-list.dark {
        background-color: #232323;
    }

    .menu-list.green {
        border-right-color: #ddd;
        background-color: #f7f7f7;
        color: #333;
    }

    .menu-list.grey {
        border-right-color: #555;
        background-color: #303030;
    }

    .menu-list.blue {
        border-right-color: #ddd;
        background-color: #f9f9f9;
        color: #333;
    }

    .menu-list li a {
        cursor: pointer !important;
    }

.menu-link {
    position: relative;
    display: inline-block;
    width: 50px;
    background-color: #fff;
}

    .menu-link.dark {
        background-color: #1c1c1c;
    }

    .menu-link.green {
        background-color: #018748;
    }

    .menu-link.grey {
        background-color: #1a1a1a;
    }

    .menu-link.blue {
        background-color: #007FAD;
    }

.menu {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: visible;
    width: 100%;
    max-width: 200px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-right: 1px solid #ddd;
}

    .menu.default {
        border-right-color: #8697A7;
    }

    .menu.grey {
        border-right-color: #525252;
    }

    .menu.dark {
        border-right-color: #444;
    }

.menu-li {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 32px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

    .menu-li:hover {
        background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.15)), to(rgba(0, 0, 0, 0.15)));
        background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15));
    }

    .menu-li.space {
        height: 40px;
        min-width: 60px;
        padding-right: 20px;
        padding-left: 10px;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

        .menu-li.space:hover {
            background-image: none;
        }

.menu-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    padding-right: 0px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 13px;
    text-align: center;
    text-decoration: none;
}

.menu-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-left: 5px;
    padding-left: 0px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    color: #fff;
    font-weight: 400;
    letter-spacing: 0.25px;
    text-decoration: none;
}

    .menu-text.blue {
        color: #333;
    }

    .menu-text.light {
        color: #f0f1f3;
        font-size: 1em;
    }

    .menu-text.green {
        color: #555;
    }

.body {
    overflow: visible;
    border: 1px solid #777;
}


.user-client {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.menu-img {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 24px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    color: #f0f1f3;
    font-size: 8px;
    line-height: 1.3em;
    margin-left: 12px;
}

    .menu-img .icon-20.green {
        filter: invert(.7);
    }

    .menu-img .icon-20.blue {
        filter: invert(.7);
    }

.dashboard {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    color: #36434E;
    height: calc(100vh - 41px);
    height: calc(var(--app-height) - 41px);
}

    .dashboard:not(.loading) {
        background-color: #EAECEE;
    }

    .dashboard.dark {
        background-color: #000;
        color: #f0f1f3;
    }

    .dashboard.grey {
        background-color: #404040;
        color: #f0f1f3;
    }

    .dashboard.green {
        background-color: #f7f7f7;
    }

    .dashboard.blue {
        background-color: #edf0f5;
    }

.menu-link,
.kubra-title,
.quick-access,
.blade-header-title,
.menu,
.news-slider,
.cards,
.box-title,
.blade-header,
.tabs-menu,
.tab-menu-closer,
.blade-item-action-bar,
.action-form,
.pagination,
.button,
.actionIcons,
.overview-container,
.coming-soon,
thead.MuiTableHead-root {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Opera and Firefox */
}

    .kubra-title .title-logo img {
        display: none;
        height: 25px;
    }

.selectedClientOption {
    background-color: #CBD0D4 !important;
    font-weight: bold !important;
}

    .selectedClientOption.dark {
        background-color: #242424 !important;
    }

.clientOption img {
    width: 25px;
    margin-bottom: 5px;
}

.pagination {
    width: 100%;
}

.flex-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    min-width: 320px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    height: 100vh;
    height: var(--app-height);
}

    .flex-wrapper.error {
        position: fixed;
        display: block;
        width: 100%;
        height: 100%;
        min-height: 0vh;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .flex-wrapper.menu-undefined {
        min-width: unset;
    }

.icon {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 0px;
}

.hamburger {
    position: relative;
    display: flex;
    width: 39px;
    height: 39px;
    justify-content: center;
    align-items: center;
    margin: auto;
    border-radius: 25px;
}

    .hamburger:hover {
        background-color: rgba(0, 0, 0, 0.1);
    }

    .hamburger.dark:hover {
        background-color: #254fb7;
    }

    .hamburger.grey:hover {
        background-color: rgba(111, 237, 255, 0.1);
    }

.landing {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: calc(100vh - 40px);
    height: calc(var(--app-height) - 40px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.choice {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    min-height: 160px;
    padding: 15px 15px 5px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    border-style: solid;
    border-width: 1px;
    border-color: rgba(0, 0, 0, 0.02);
    border-radius: 10px;
    box-shadow: 1px 2px 2px 0 rgba(0, 0, 0, 0.3);
    opacity: 0.9;
    background-color: #FFFFFF;
    color: #242424;
    font-size: 14px;
    font-weight: 400;
    text-decoration: none;
}

    .choice:hover {
        border-color: #aaa;
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3);
        opacity: 1;
    }

    .choice.dark {
        border-color: #666;
        background-color: #333;
        color: #f0f1f3;
    }

    .choice.grey {
        border-color: #666;
        background-color: #555;
        color: #f0f1f3;
    }

.choice-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-bottom: 1px none #eee;
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
    color: #36434E;
    font-size: 1rem;
    line-height: 1.3em;
    font-weight: 400;
    text-decoration: none;
}

.choice-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-left: 10px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-size: 18px;
    font-weight: 500;
}

    .choice-text.dark {
        color: #fff;
    }

    .choice-text.grey {
        color: #fff;
    }

.choice-description {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    min-height: 60px;
    padding-top: 10px;
    padding-right: 15px;
    padding-bottom: 10px;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    color: #242424;
}

.choice.grey .choice-description,
.choice.dark .choice-description {
    color: #FFFFFF
}


.cards {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    grid-auto-columns: 1fr;
    grid-template-areas: ".";
    -ms-grid-columns: 1fr 25px 1fr 25px 1fr 25px 1fr 25px 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    -ms-grid-rows: auto 25px auto 25px auto 25px auto 25px auto 25px auto;
    grid-template-rows: auto auto auto auto auto auto;
    align-items: stretch;
}

.pinnedGraphs {
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

    .pinnedGraphs > .formColumnWrapper > .bladeComponentWrapper {
        border: 1px solid rgba(0, 0, 0, 0.02);
        border-radius: 10px;
        box-shadow: 1px 2px 2px 0 rgba(0, 0, 0, 0.3);
        margin: 0 7px 30px 7px;
        opacity: 0.9;
        background-color: #fff;
    }

        .pinnedGraphs > .formColumnWrapper > .bladeComponentWrapper.dark {
            background-color: #333;
            border-color: #666;
        }

        .pinnedGraphs > .formColumnWrapper > .bladeComponentWrapper.grey {
            background-color: #555;
            border-color: #666;
        }

.close-side-panel {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 40px;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

    .close-side-panel:hover {
        background-color: rgba(0, 0, 0, 0.1);
    }

    .close-side-panel.red:hover {
        background-color: red;
    }

.home-link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #526273;
    font-weight: 300;
    text-decoration: none;
}

    .home-link:hover {
        text-decoration: none;
    }

.menu-line {
    width: 50px;
    height: 20px;
    max-height: 2px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-bottom: 1px solid #ddd;
}

    .menu-line._2 {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .menu-line._3 {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        max-width: 10px;
    }

.quick-access {
    display: flex;
    align-items: stretch;
    margin-left: auto;
}

.panel {
    position: fixed;
    left: auto;
    top: 0%;
    right: 0%;
    bottom: 0%;
    z-index: 20;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    width: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    background-color: transparent;
    color: #242424;
    height: 100vh;
    height: var(--app-height);
}

.panel-nav {
    display: flex;
    width: 100%;
    height: 50px;
    max-width: 400px;
    padding-top: 10px;
    padding-right: 0px;
    padding-left: 8px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    font-size: 22px;
    background-color: #fff;
}

.message-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 15px;
    color: #333;
    cursor: pointer;
}

    .message-row:hover {
        background-color: #dde7ff;
    }

.panel-row-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 25px;
    padding-right: 5px;
    padding-left: 5px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-weight: 600;
}

    .panel-row-title.show {
        height: 50px;
    }

.panel-content {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    max-width: 400px;
    padding-right: 15px;
    padding-left: 15px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background-color: #fff;
    box-shadow: -5px 0 10px 0 rgba(0, 0, 0, 0.4);
}

    .panel-content.dark {
        border-left: 1px solid #444;
        background-color: #323232;
        color: #f0f1f3;
    }

    .panel-content.grey {
        border-left: 1px solid #444;
        background-color: #323232;
        color: #f0f1f3;
    }

.q-link {
    position: relative;
    display: flex;
    min-width: 40px;
    height: 40px;
    padding-right: 5px;
    padding-left: 5px;
    justify-content: center;
    align-items: center;
    border-radius: 2px;
    color: #0093C9;
    text-decoration: none;
    font-size: 15px;
}

    .q-link:hover {
        background-color: rgba(0, 0, 0, 0.1) !important;
    }

    .q-link.msg {
        min-width: 40px;
        background-image: url('/images/bell.svg');
        background-position: 50% 50%;
        background-size: 24px;
        background-repeat: no-repeat;
        color: red;
        font-size: 13px;
        font-weight: 700;
    }

    .q-link.usr {
        width: auto;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        color: #666;
        min-width: 223px;
        padding-left: 10px;
    }

        .q-link.usr svg {
            margin-right: 10px;
            margin-bottom: 3px;
        }

        .q-link.usr.dark {
            color: #f0f1f3;
        }

    .q-link.dark {
        color: #0093C9;
        cursor: pointer;
    }

        .q-link.dark:hover {
            background-color: #222;
        }

    .q-link.off {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .q-link.red:hover {
        background-color: red !important;
    }

        .q-link.red:hover img {
            filter: brightness(500%);
        }

    .q-link.usr.disabled:hover {
        background-color: transparent !important;
    }

    .q-link.usr.disabled a {
        cursor: default !important;
    }

    .q-link.red.mod {
        position: absolute;
        top: 0px;
        right: 0px;
        width: 40px;
        height: 40px;
    }

    .q-link.closer:hover {
        background-color: transparent;
    }

    .q-link.closer.white {
        max-height: 50px;
    }

        .q-link.closer.white:hover {
            background-color: red;
        }

    .q-link.act {
        min-width: 40px;
    }

    .q-link.grey {
        color: #0093C9;
    }

    .q-link.right {
        min-height: 30px;
    }

    .q-link.blue {
        color: #0093C9;
    }

    .q-link.news {
        color: #fff;
        font-weight: 400;
    }

.user-client {
    color: #666;
    font-size: 16px;
    font-weight: 300;
}

    .user-client.default {
        font-weight: 500;
    }

    .user-client img {
        filter: brightness(300%);
        margin-left: 5px;
        width: 20px;
        height: 20px;
    }

    .user-client.default img {
        filter: unset;
    }

    .user-client.dark {
        color: #fff;
    }

    .user-client.green {
        color: #fff;
    }

    .user-client.grey {
        color: #fff;
    }

    .user-client.blue {
        color: #fff;
    }

.user-name {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 25px;
    width: 25px;
    padding-right: 0px;
    padding-left: 0px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #666;
    font-weight: 400;
    border: 1px solid #666;
    border-radius: 30px;
    font-size: 13px;
}

    .user-name.dark {
        color: #fff;
        border-color: #fff;
    }

    .user-name.green {
        color: #fff;
        border-color: #fff;
    }

    .user-name.grey {
        color: #fff;
        border-color: #fff;
    }

    .user-name.blue {
        color: #fff;
        border-color: #fff;
    }

.link {
    color: #09f;
    text-decoration: none;
}

    .link:hover {
        text-decoration: underline;
    }

.title-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    color: #fff;
    font-size: 16px;
    align-items: center;
    padding: 2px 0px 0px 10px;
    white-space: nowrap;
}

    .title-text.default {
        color: #666;
        font-weight: 500;
    }


.mob-qlinks {
    display: none;
}

.blade {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.blade-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    max-height: 75vh;
    padding-left: 200px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

    .blade-item.pop {
        overflow: hidden;
        height: auto;
        padding-right: 20px;
        padding-bottom: 0px;
        padding-left: 20px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        font-weight: 400;
    }

.blade-item-action-bar {
    display: flex;
    height: 50px;
    border-bottom-color: #fff;
    background-color: #fff;
    color: #333;
    align-items: center;
    padding-top: 14px;
    margin-bottom: 10px;
    position: relative;
}

    .blade-item-action-bar .blade-header-title {
        min-width: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: inline-block;
        line-height: 35px;
        margin-left: 10px;
    }

    .blade-item-action-bar.dark {
        border-bottom-color: #111;
        background-color: #111;
        color: #ddd;
    }

    .blade-item-action-bar.grey {
        border-bottom-color: transparent;
        background-color: transparent;
        color: #f0f1f3;
    }

    .blade-header.pop .q-links:not(.mobile),
    .blade-item-action-bar .q-links:not(.mobile) {
        display: flex;
    }

    .blade-header.pop .q-links.mobile,
    .blade-item-action-bar .q-links.mobile {
        display: none;
    }


.blade-header {
    position: static;
    z-index: 2;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 40px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-align-content: space-around;
    -ms-flex-line-pack: distribute;
    align-content: space-around;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-bottom: #ddd 1px solid;
    background-color: #007FAD;
    color: #FFFFFF;
}

.blade-content .blade-header.default .q-link {
    color: #fff;
}

.blade-header.pop {
    min-height: 72px;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-bottom-style: solid;
    border-bottom-color: #ddd;
    background-color: #fff;
    color: #f0f1f3;
    font-weight: 600;
    border-bottom: none !important;
    font-size: 22px;
    padding-left: 10px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

.legacy-popup .blade-header {
    margin-top: 6px;
}

.blade-header.pop.dark {
    background-color: rgb(34, 34, 34);
}

.blade-header.pop.grey {
    border-bottom-color: #666;
    background-color: #424242;
}

.dark .panel-nav,
.grey .panel-nav {
    background-color: rgb(50, 50, 50);
}

.blade-header.news {
    background-color: transparent;
}

.blade-header.dark {
    border-bottom: 1px solid #444;
    background-color: #111;
}

.blade-header.grey {
    border-style: none none solid;
    border-width: 1px;
    border-color: #ddd #ddd #555;
    background-color: transparent;
    color: #333;
}

.blade-header.blue {
    border-bottom-style: solid;
    background-color: #fff;
    color: #333;
}

.blade-header.green {
    border-bottom-style: solid;
    background-color: #fff;
    color: #333;
}

.blade-content {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    height: 100%;
    padding-top: 0px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    background-color: #fff;
}

    .blade-content.dark {
        /* border: 1px solid #222; */
        background-color: #111;
    }

    .blade-content.grey {
        background-color: #404040;
    }

.icon-24 {
    width: 24px;
    height: 24px;
}

    .icon-24.right {
        margin-right: 5px;
    }

        .icon-24.right.grey {
            -webkit-filter: brightness(300%);
            filter: brightness(300%);
        }

    .icon-24.grey {
        -webkit-filter: brightness(200%);
        filter: brightness(200%);
    }

.text-field {
    width: 100%;
    min-height: 40px;
    --min-width: 300px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    padding: 0px 10px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-radius: 4px;
    background-color: transparent;
    /* color: rgba(0, 0, 0, 0.4); */
}

.text-field,
.textarea-input {
    border: 1px solid #ddd;
}

    .textarea-input:hover:not([readonly]):not(.readonly),
    .text-field:hover:not([readonly]):not(.readonly) {
        border-color: #007FAD;
    }

    .text-field::-webkit-input-placeholder {
        color: rgba(0, 0, 0, 0.4);
    }

    .text-field:-ms-input-placeholder {
        color: rgba(0, 0, 0, 0.4);
    }

    .text-field::-ms-input-placeholder {
        color: rgba(0, 0, 0, 0.4);
    }

    .text-field::placeholder {
        color: rgba(0, 0, 0, 0.4);
    }

    .text-field.search.dark {
        border-color: #444;
        background-color: #111;
        color: #f0f1f3;
    }

        .text-field.search.dark:hover {
            border-bottom-color: #254fb7;
        }

    .text-field.search.grey {
        border-color: #555;
        color: #fff;
    }

        .text-field.search.grey:hover {
            background-color: hsla(0, 0%, 100%, 0.1);
        }

        .text-field.search.grey:focus {
            background-color: transparent;
        }

        .text-field.search.grey::-webkit-input-placeholder {
            color: rgba(240, 241, 243, 0.6);
        }

        .text-field.search.grey:-ms-input-placeholder {
            color: rgba(240, 241, 243, 0.6);
        }

        .text-field.search.grey::-ms-input-placeholder {
            color: rgba(240, 241, 243, 0.6);
        }

        .text-field.search.grey::placeholder {
            color: rgba(240, 241, 243, 0.6);
        }

    .textarea-input.dark,
    .text-field.dark,
    .dropzone-input.dark {
        border-color: #444;
        background-color: #111;
        color: #f0f1f3;
    }


        .text-field.dark::-webkit-input-placeholder {
            color: hsla(0, 0%, 100%, 0.5);
        }

        .text-field.dark:-ms-input-placeholder {
            color: hsla(0, 0%, 100%, 0.5);
        }

        .text-field.dark::-ms-input-placeholder {
            color: hsla(0, 0%, 100%, 0.5);
        }

        .text-field.dark::placeholder {
            color: hsla(0, 0%, 100%, 0.5);
        }

    .text-field.small {
        max-width: 200px;
    }

    .textarea-input.grey,
    .text-field.grey,
    .dropzone-input.grey {
        border-color: #666;
        background-color: #333;
        color: #fff;
    }

        .text-field.grey::-webkit-input-placeholder {
            color: hsla(0, 0%, 100%, 0.4);
        }

        .text-field.grey:-ms-input-placeholder {
            color: hsla(0, 0%, 100%, 0.4);
        }

        .text-field.grey::-ms-input-placeholder {
            color: hsla(0, 0%, 100%, 0.4);
        }

        .text-field.grey::placeholder {
            color: hsla(0, 0%, 100%, 0.4);
        }

/* .text-field:-webkit-autofill,
.text-field:-webkit-autofill:hover, 
.text-field:-webkit-autofill:focus {
  border: 1px solid #ddd !important;
 -webkit-text-fill-color: #333;
  -webkit-box-shadow: 0 0 0px 1000px #fff inset;
  transition: background-color 5000s ease-in-out 0s;
}

.text-field.dark:-webkit-autofill,
.text-field.dark:-webkit-autofill:hover, 
.text-field.dark:-webkit-autofill:focus {
  border: 1px solid #444 !important;
 -webkit-text-fill-color: #fff;
  -webkit-box-shadow: 0 0 0px 1000px #111 inset;
  transition: background-color 5000s ease-in-out 0s;
}

.text-field.grey:-webkit-autofill,
.text-field.grey:-webkit-autofill:hover, 
.text-field.grey:-webkit-autofill:focus {
  border: 1px solid #666 !important;
 -webkit-text-fill-color: #fff;
  -webkit-box-shadow: 0 0 0px 1000px rgba(0, 0, 0, 0.05) inset;
  transition: background-color 5000s ease-in-out 0s;
} */

.icon-14 {
    width: 14px;
    height: 14px;
}

.icon-16 {
    width: 16px;
    height: 16px;
}

.icon-20 {
    width: 20px;
    height: 20px;
}

    .icon-20.date {
        margin-top: 10px;
        margin-left: -25px;
    }

    .icon-20.right {
        margin-right: 5px;
    }

    /* .icon-20.right.grey {
  -webkit-filter: brightness(300%);
  filter: brightness(300%);
} */

    .icon-20.left {
        margin-left: 5px;
    }

.icon-40 {
    width: 40px;
    height: 40px;
}


.header-title {
    display: inline-block;
    padding-left: 8px;
    font-size: 20px;
}

    .header-title.default {
        color: #242424;
    }

    .header-title.blue {
        color: #333;
    }

    .header-title.green {
        color: #333;
    }

    .header-title.grey {
        color: #f0f1f3;
    }

.blade-popup .header-title,
.panel-nav .slideOutTitle {
    padding-left: 5px;
    font-size: 24px;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 24px;
    width: unset !important;
}

.blade-popup .blade-header .blade-q-links,
.panel-content .panel-nav .blade-q-links {
    align-items: center;
    position: absolute;
    right: 0px;
}

.blade-popup .blade-header .close-side-panel {
    width: 35px;
    height: 35px;
    margin-left: 5px;
}

.panel-content .panel-nav .blade-q-links {
    right: 15px;
}

.blade-popup.popup .blade-header {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

.blade-popup.popup .modal-footer {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

.blade-popup.popup-app .header-title,
.blade-popup.popup-blade .header-title,
.blade-popup.popup-full .header-title {
    padding-left: 10px;
}

.blade-header-title {
    display: flex;
    padding-left: 13px;
    color: #fff;
    font-size: 24px;
    font-weight: 400;
    margin-right: 10px;
    align-items: center;
    justify-content: flex-start;
}

    .blade-header-title.blue {
        color: #333;
    }

    .blade-header-title.green {
        color: #333;
    }

    .blade-header-title.grey {
        color: #fff;
    }

    .blade-header-title.new {
        width: auto;
        padding-left: 0px;
        color: rgba(0, 0, 0, 0.85);
        font-weight: 500;
    }

        .blade-header-title.new.dark {
            color: #fff;
        }

        .blade-header-title.new.grey {
            color: #fff;
        }

        .blade-header-title.new .icon-24 {
            filter: invert(.7);
        }

            .blade-header-title.new .icon-24.dark {
                filter: none;
            }

            .blade-header-title.new .icon-24.grey {
                filter: none;
            }

            .blade-header-title.new .icon-24.green {
                filter: invert(.7);
            }

            .blade-header-title.new .icon-24.blue {
                filter: invert(.7);
            }

/* applies to v1 only */
.legacy-popup .blade-header-title {
    width: calc(100% - 25px);
    height: 40px;
}

/* applies to v1 only */
.legacy-popup:not(.transparent) .blade-header-title {
    margin: 17px 20px 15px 5px;
}

/* applies to v1 only */
.legacy-popup .q-link {
    height: 40px;
}

/* applies to v1 only */
.legacy-popup .blade-header-title .header-title {
    max-width: calc(100% - 60px);
    text-overflow: ellipsis;
    overflow: hidden;
}

.blade-header .icon-24.green {
    filter: invert(.7);
}

.blade-header .icon-24.blue {
    filter: invert(.7);
}


.blade-q-links {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.tabs {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    width: 100%;
    height: 100%;
    box-shadow: none;
}

.tabs-menu {
    position: absolute;
    left: 0px;
    top: 40px;
    bottom: 0px;
    z-index: 7;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 225px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    border-right: 1px solid #ddd;
    background-color: #F6F6F6;
    color: #FFFFFF;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    height: calc(100vh - 130px);
    height: calc(var(--app-height) - 130px);
}

    .tabs-menu.dark {
        border-right-color: #444;
        background-color: #111;
    }

    .tabs-menu.blue {
        background-color: #fff;
    }

    .tabs-menu.grey {
        border-right-color: #555;
        background-color: #404040;
        color: #f0f1f3;
    }

    .tabs-menu.green {
        background-color: #fff;
    }

    .tabs-menu.hidden {
        width: 20px;
        padding-left: 0;
        padding-right: 0;
        padding-top: 0;
        overflow: hidden;
        height: calc(100vh - 80px);
        height: calc(var(--app-height) - 80px);
        padding-right: 0px;
        padding-left: 0px;
    }

.tabs-content {
    width: 100%;
}

.tab-link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 32px;
    padding: 0px 0px 0px 5px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    font-size: 13px;
    font-weight: 400;
    color: #242424;
}

    .tab-link:not(.title):hover {
        background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.1)));
        background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1));
    }

    .tab-link.w--current {
        background-color: rgba(0, 0, 0, 0.1);
        font-weight: 700;
    }

    .tab-link.title {
        height: auto;
        min-height: 40px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        font-weight: 400;
    }

    .tab-link.dark {
        color: #f0f1f3;
    }

        .tab-link.dark:hover {
            background-color: #333;
            background-image: none;
        }

        .tab-link.dark.w--current:hover {
            background-color: #222;
        }

    .tab-link.grey {
        color: #f0f1f3;
    }

.q-links {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-right: 0px;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    /* margin-left: -11px; */
}

    .q-links .q-link {
        padding: 5px;
        height: 32px;
        color: #222222;
        margin: 0 3px 0 3px;
        background-color: transparent;
        padding: 0px 16px 0px 12px;
        height: 35px;
        font-size: 15px;
        font-weight: 400;
        border-radius: 4px;
        border: 1px solid #d3d3d3;
    }

        .q-links .q-link.dark {
            color: #f2f2f2;
            border-color: #666;
        }

        .q-links .q-link.grey {
            color: #f2f2f2;
            border-color: #666;
        }

.q-link.refresh {
    padding: 9px 12px 10px 12px;
}

.checkBoxHorizontal {
    display: flex;
}

.checkbox-field {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 30px;
    margin-bottom: 0px;
    /* padding-right: 10px;
  padding-left: 10px; */
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

    .checkbox-field.hide {
        display: none;
    }

    .checkbox-field.top {
        margin-top: 10px;
    }

    .checkbox-field.title {
        margin-top: 20px;
        border-bottom: 1px solid #ddd;
    }

.check {
    width: 18px;
    height: 18px;
    margin-top: 0px;
    margin-left: 0px;
}

.checkbox-label {
    margin-bottom: 0px;
    padding-left: 10px;
}

    .checkbox-label.title {
        font-weight: 700;
    }

.blade-body {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow-y: auto;
    overflow-x: hidden;
    width: auto;
    padding-left: 15px;
    padding-right: 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border: 1px none #ddd;
    border-radius: 0px;
    background-color: #FFFFFF;
    height: calc(100vh - 140px);
    height: calc(var(--app-height) - 140px);
}

    .blade-body.hasBladeFilter {
        height: calc(100vh - 200px);
        height: calc(var(--app-height) - 200px);
    }

.bladeComponent {
    overflow: hidden;
    overflow-y: auto;
}

    /* Max Table Component height when there a Blade Header and Blade Body  */
    .bladeComponent:only-child {
        max-height: calc(100vh - 155px);
        max-height: calc(var(--app-height) - 155px);
    }
        /* Max Table Component height when there a Blade Header and Blade Body with pagination */
        .bladeComponent:only-child .tableHeightAdjust {
            max-height: calc(100vh - 230px);
            max-height: calc(var(--app-height) - 230px);
        }
            /* Max Table Component height when there a Blade Header and Blade Body with no pagination */
            .bladeComponent:only-child .tableHeightAdjust:only-child {
                max-height: calc(100vh - 190px);
                max-height: calc(var(--app-height) - 190px);
            }

        .bladeComponent:only-child .bladeFormV2.hasFilters .tableHeightAdjust:only-child {
            max-height: calc(100vh - 310px);
            max-height: calc(var(--app-height) - 310px);
        }

    /* Max Table Component height when there a Blade Header, (Filter | Blade Filter)  and Blade Body */
    .BladeSectionWrapper.BladeHeader + .BladeSectionWrapper.BladeFilter + .BladeSectionWrapper.BladeBody > .blade-body .bladeComponent:only-child,
    .bladeComponent:not(:only-child) {
        max-height: calc(100vh - 200px);
        max-height: calc(var(--app-height) - 200px);
    }
        /* Max Table Component height when there a Blade Header, Filter, and Blade Body with pagination */
        .BladeSectionWrapper.BladeHeader + .BladeSectionWrapper.BladeFilter + .BladeSectionWrapper.BladeBody > .blade-body .bladeComponent:only-child .tableHeightAdjust,
        .bladeComponent:not(:only-child) .tableHeightAdjust {
            max-height: calc(100vh - 275px);
            max-height: calc(var(--app-height) - 275px);
        }
            /* Max Table Component height when there a Blade Header, Filter, and Blade Body with no pagination */
            .BladeSectionWrapper.BladeHeader + .BladeSectionWrapper.BladeFilter + .BladeSectionWrapper.BladeBody > .blade-body .bladeComponent:only-child .tableHeightAdjust:only-child,
            .bladeComponent:not(:only-child) .tableHeightAdjust:only-child {
                max-height: calc(100vh - 225px);
                max-height: calc(var(--app-height) - 225px);
            }

        .bladeComponent:not(:only-child) .bladeFormV2.hasFilters .tableHeightAdjust {
            max-height: calc(100vh - 335px);
            max-height: calc(var(--app-height) - 335px);
        }

.popup-app .tableHeightAdjust {
    max-height: calc(100vh - 260px);
    max-height: calc(var(--app-height) - 260px);
}

.popup-app .hasFilters .tableHeightAdjust {
    max-height: calc(100vh - 305px);
    max-height: calc(var(--app-height) - 305px);
}

.popup-blade .tableHeightAdjust {
    max-height: calc(100vh - 300px);
    max-height: calc(var(--app-height) - 300px);
}

.popup-blade .hasFilters .tableHeightAdjust {
    max-height: calc(100vh - 350px);
    max-height: calc(var(--app-height) - 350px);
}

.blade-body.coming-soon {
    height: 80vh;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 2em;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.normal-label {
    text-decoration: none;
    text-transform: none;
}

.blade-body.dark {
    background-color: #111;
    color: #ddd;
}

.blade-body.grey {
    background-color: transparent;
    color: #fff;
}

.blade-body.blue {
    background-color: #fff;
}

.blade-body.green {
    background-color: #fff;
}

.button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 50px;
    max-width: 250px;
    margin-top: 25px;
    margin-bottom: 25px;
    font-size: 18px;
    font-weight: 400;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-radius: 4px;
    text-decoration: none;
    border-style: solid;
    border-width: 1px;
    border-color: #666;
}

    .button:hover {
        background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.25)), to(rgba(0, 0, 0, 0.25)));
        background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25));
    }

    .button:active {
        background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.5)));
        background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
    }

    .button.off {
        opacity: 0.25;
        cursor: not-allowed;
        background-image: unset !important;
    }

    .button.negative {
        border: 1px solid #d00;
        background-color: #fff;
        color: #d00;
        cursor: pointer;
    }

        .button.negative:hover {
            background-color: #d00;
            background-image: none;
            color: #fff;
        }

        .button.negative:active {
            background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2)));
            background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
        }

    .button.mod {
        position: absolute;
        right: auto;
        bottom: 0px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

    .button.foot, .button.actionButton, .bladeForm .button {
        width: auto;
        height: 34px;
        max-width: 150px;
        min-width: 94px;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: 15px;
        padding-right: 20px;
        padding-left: 20px;
        font-size: 14px;
        font-weight: 700;
        border: none;
    }

    .button.actionButton {
        margin-top: 15px;
        margin-bottom: 15px;
        margin-left: 0px;
    }

.bladeComponent .button, .formColumnWrapper .button {
    margin-top: 25px;
    margin-bottom: 25px;
    margin-left: 0px;
}

.formColumnWrapper.col-lg-12 > .button {
    margin-top: 5px;
    margin-bottom: 5px;
}

.formColumnWrapper.formCalendar .form-label {
    display: none;
}

#settings .button,
.news-slider .button {
    background-color: #007FAD !important;
    color: #fff !important;
}

.button.pan {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
}

.tag {
    width: 18px;
    height: 18px;
    margin: 0px 5px 0px 0px;
    padding-left: 0px;
    border-radius: 20px;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    align-items: center;
    -webkit-box-align: center;
}

.bladeForm .tag {
    width: 20px;
    height: 20px;
}

.tagTypeA {
    max-width: 20px;
    margin-left: -12px;
    margin-top: 0px;
}

.badge {
    display: inline-block;
    border-radius: 2px;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    color: #fff;
    padding: 0 6px;
}

.badge-color-grey,
.badge-color-yellow {
    color: #000;
}

.field-text .badge {
    padding: 3px 9px;
}

.button.icon-tag {
    width: 18px;
    height: 18px;
    margin-top: 0px;
    margin-right: 5px;
    margin-bottom: 0px;
    padding-right: 0px;
    padding-left: 0px;
    border-radius: 20px;
    font-family: Oswald, sans-serif;
    font-size: 0.8em;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.blade-popup {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 12;
    width: 100%;
    height: 100vh;
    height: var(--app-height);
    background-color: rgba(0, 0, 0, 0.5);
    color: #333;
}

    .blade-popup.dark, .blade-popup.grey {
        border-top: 1px none #000;
        background-color: rgba(0, 0, 0, 0.35);
    }

.blade-popup-content.loading .blade-header,
.blade-popup-content.loading .modal-footer {
    display: none;
}

.blade-popup-content.loading {
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

.blade-popup-content {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    overflow: visible;
    min-width: 300px;
    max-height: calc(70vh);
    max-width: 95vw;
    min-height: 200px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-radius: 6px;
    background-color: #fff;
    box-shadow: 3px 4px 15px 5px rgba(0, 0, 0, 0.4);
    font-weight: 400;
    margin: calc(15vh) auto;
}

.blade-popup._1 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.blade-item-details {
    width: 20%;
    padding-right: 20px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

    .blade-item-details._40 {
        width: 40%;
    }

.blade-details-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    max-width: 200px;
    margin-bottom: 15px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    color: rgba(0, 0, 0, 0.75);
}

    .blade-details-item.dark {
        color: #f0f1f3;
    }

.label {
    margin-top: 16px;
    color: #777;
    font-size: 0.75em;
    line-height: 1.3em;
    font-weight: 600;
}

    .label.first {
        margin-top: 0px;
    }

.case-details {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.blade-subtitle {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 50px;
    padding-left: 0px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    color: #333;
    font-size: 1.15em;
    font-weight: 400;
}

    .blade-subtitle.box {
        width: auto;
        margin-right: 20px;
        color: #000;
        font-weight: 500;
    }

    .blade-subtitle.dark {
        color: hsla(0, 0%, 100%, 0.75);
    }

    .blade-subtitle.grey {
        color: hsla(0, 0%, 100%, 0.75);
    }

.case-status {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 30px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-weight: 400;
}

.case-status-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-right: 25px;
    padding-top: 10px;
    padding-bottom: 10px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.case-status-light {
    width: 16px;
    height: 16px;
    margin-right: 10px;
    border-radius: 25px;
    background-color: #07b100;
}

    .case-status-light.plat {
        background-color: #526273;
    }

.pin-card {
    position: absolute;
    right: 5px;
    top: 5px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 30px;
    height: 30px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.col-lg-1 .text-field {
    min-width: 50px;
}

.col-lg-2 .text-field {
    min-width: 100px;
}

.popup-app:not(.loading) {
    top: 40px;
    left: 200px;
    width: unset;
}

.popup-blade:not(.loading) {
    top: 80px;
    left: 425px; 
    width: unset;
}

.NoMenu.popup-blade:not(.loading) {
    top: 80px;
    width: unset;
}

.NoMenu.Collapsed.popup-blade:not(.loading) {
    left: 50px;
}

.NoMenu:not(.Collapsed).popup-blade:not(.loading) {
    left: 200px;
}

.popup-app .modal-content,
.popup-blade .modal-content {
    padding-left: 15px;
    padding-right: 15px;
}

.popup-blade:not(.loading) .blade-header.pop,
.popup-app:not(.loading) .blade-header.pop {
    margin-top: 10px;
}

.popup-app:not(.loading) .blade-popup-content,
.popup-blade:not(.loading) .blade-popup-content {
    margin: 0px;
    min-width: calc(100vw - 200px);
    min-height: calc(100vh - 40px);
    min-height: calc(var(--app-height) - 40px);
    max-width: unset !important;
    border-radius: 0px;
    box-shadow: unset;
}

.popup-app.dark .blade-popup-content,
.popup-blade.dark .blade-popup-content {
    border: unset;
}

.popup-blade:not(.loading) .blade-popup-content {
    min-width: calc(100vw - 425px);
    min-height: calc(100vh - 80px);
    min-height: calc(var(--app-height) - 80px);
    border-radius: 0px;
}

/* controling the popup-app popups */
.menu-docked-collapsed
.popup-app:not(.loading) {
    left: 50px;
}

    .menu-docked-collapsed
    .popup-app:not(.loading) .blade-popup-content {
        min-width: calc(100vw - 50px);
    }

.menu-floating
.popup-app:not(.loading),
.menu-floating-collapsed
.popup-app:not(.loading) {
    left: 0px;
}

    .menu-floating-collapsed
    .popup-app:not(.loading) .blade-popup-content {
        min-width: 100vw;
    }

/* controling the popup-blade popup */
.menu-docked-collapsed
.popup-blade:not(.loading) {
    left: 275px;
}

.menu-docked.blades-collapsed
.popup-blade:not(.loading) {
    left: 220px;
}

.menu-docked-collapsed.blades-collapsed
.popup-blade:not(.loading) {
    left: 70px;
}

.menu-floating-collapsed 
.NoMenu.popup-blade:not(.loading) {
    left: 0px;
}

.menu-floating
.popup-blade:not(.loading),
.menu-floating-collapsed
.popup-blade:not(.loading) {
    left: 225px;
}

.menu-floating.blades-collapsed
.popup-blade:not(.loading),
.menu-floating-collapsed.blades-collapsed
.popup-blade:not(.loading) {
    left: 20px;
}

.invisible-tab-menu-closer {
    display: none;
}

.popup-full.transparent {
    background-color: rgba(0,0,0,0.9);
}

    .popup-app .blade-header,
    .popup-blade .blade-header,
    .popup-full .blade-header,
    .popup-full.transparent .blade-header {
        padding-left: 5px;
    }

    .popup-full.transparent .blade-item.pop {
        padding-right: 0px;
        padding-left: 0px;
    }

    .popup-full.transparent .blade-header-title {
        padding-left: 0px;
    }

.popup-full .blade-header,
.popup-full .blade-item,
.popup-full .modal-footer {
    background-color: transparent !important;
}

.popup-app .blade-header,
.popup-blade .blade-header,
.popup-full .blade-header {
    min-height: 50px !important;
}

.popup-app .modal-footer,
.popup-blade .modal-footer,
.popup-full .modal-footer {
    margin-top: 0px !important;
}

.blade-popup .blade-header,
.blade-popup .blade-header .q-link {
    max-height: 40px;
}

    .blade-popup .blade-header .blade-q-links {
        margin: 17px 20px 15px 5px;
    }

.popup-full.transparent .header-title,
.popup-full.transparent .form-label,
.popup-full.transparent .form-sub-title {
    color: #fff !important;
}

.popup-app .blade-header .blade-q-links,
.popup-blade .blade-header .blade-q-links,
.popup-full .blade-header .blade-q-links {
    margin: 7px 20px 0px 0px;
}

.popup-full.transparent .blade-header .blade-q-links img {
    filter: brightness(500%);
}

.popup-full .blade-popup-content {
    margin: 0px;
    min-width: 100vw;
    min-height: 100vh;
    min-height: var(--app-height);
    border-radius: 0px;
}

.popup-full.transparent .blade-popup-content {
    background-color: transparent !important;
}

.popup-blade .blade-item,
.popup-app .blade-item,
.popup-full .blade-item {
    max-height: none;
    flex: auto;
    padding-top: 10px;
}

.popup-app .loading .blade-item .form-block,
.popup-full .loading .blade-item .form-block,
.popup-full.transparent .blade-item .form-block {
    margin: auto auto;
}

.popup-full .col-lg-12 .textarea-input {
    min-width: 100%;
}

.form-image, .form-audio, .form-video, .form-pdf {
    width: 100%;
    text-align: center
}

    .form-audio audio, .form-video video, .form-pdf embed, .form-image img {
        max-height: 60vh !important;
    }

.popup-md .form-video video, .popup .form-video video, .popup-lg .form-video video {
    max-height: 50vh !important;
}

.popup-full .form-video video,
.popup-full.transparent .form-video video {
    max-height: 65vh !important;
}

.popup-full .form-pdf embed {
    min-width: calc(100vw - 75px);
    max-height: calc(100vh - 180px) !important;
    max-height: calc(var(--app-height) - 180px) !important;
}

.popup-full.transparent .form-pdf embed {
    min-width: calc(100vw - 30px);
    min-height: calc(100vh - 145px) !important;
    min-height: calc(var(--app-height) - 145px) !important;
}

.popup-full .textarea-input {
    max-height: calc(100vh - 180px);
    max-height: calc(var(--app-height) - 180px);
}

.popup-full.transparent .textarea-input {
    max-height: calc(100vh - 160px);
    max-height: calc(var(--app-height) - 160px);
}

.popup-full.transparent .form-label {
    display: none;
}

.form-audio audio, .form-video video {
    width: 100%;
}

.popup-full.transparent .form-audio audio {
    min-width: 350px;
}

.popup-full .bladeForm {
    margin-bottom: 0px !important;
}

.tooltipIcon {
    display: inline-flex;
    width: 14px;
    height: 14px;
}

    .tooltipIcon img {
        vertical-align: unset;
    }

.tooltipParent-blade, .tooltipParent-popup, .tooltipParent-popupTitle {
    margin-left: 4px !important;
}

.tooltipParent-slideOut, .tooltipParent-slideOutTitle {
    margin-left: 9px !important;
}

.tooltipIcon.grey, .tooltipIcon.dark {
    filter: brightness(150%);
}

.tooltipIcon.helpIcon {
    cursor: help;
}

.filterTag .tooltipIcon {
    margin-top: 2px;
    margin-right: 7px !important;
}

.form-label .tooltipIcon {
    margin-left: 5px !important;
}

.tooltipBaloon {
    font-size: 0.75rem !important;
    line-height: 1.2em !important;
    font-weight: normal;
    padding: 10px;
}


.MuiTooltip-tooltip {
    background-color: #F4F4F4 !important;
    color: #333 !important;
    filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.25));
}

    .MuiTooltip-tooltip .MuiTooltip-arrow {
        color: #F4F4F4 !important;
    }

.tooltipBaloon a {
    display: block;
    margin-top: 9px;
}

    .tooltipBaloon a svg {
        display: inline-block;
        vertical-align: middle;
        margin-left: 3px;
        margin-bottom: 2px;
        fill: #0093C9;
    }

.sortWrapper {
    height: unset;
    border: 1px solid #ddd;
    border-radius: 3px;
    overflow-y: auto;
    padding-top: 10px;
    padding-bottom: 10px;
}

    .sortWrapper.dark {
        border-color: #444;
        background-color: #111;
    }

    .sortWrapper.grey {
        border-color: #666;
        background-color: #333;
    }

    .sortWrapper > div {
        min-height: 40px;
    }

.sortItemWrapper {
    margin: 10px;
    height: unset;
    padding: 0;
}

    .sortItemWrapper:first-child {
        margin-top: 0;
    }

    .sortItemWrapper:last-child {
        margin-bottom: 0;
    }

.sortItemContainer {
    display: table;
    width: 100%;
    background-color: #f2f2f2;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 3px;
}

    .sortItemContainer.hover {
        cursor: grab;
    }

        .sortItemContainer.hover:hover {
            border-color: #0093C9;
        }

    .sortItemContainer.filtered {
        cursor: no-drop;
    }

    .sortItemContainer.dark {
        background-color: #000;
        border-color: #444;
    }

    .sortItemContainer.grey {
        background-color: #333;
        border-color: #666;
    }

.sortItemHandle {
    display: table-cell;
    width: 30px !important;
    text-align: center;
    vertical-align: middle;
}

.sortItemLabel {
    display: table-cell;
    vertical-align: middle;
}

.sortItemLabelBlock {
    display: inline-block;
    margin: 0 5px;
}


.sortLabelActions {
    display: table-cell;
    width: 30px !important;
    text-align: center;
    vertical-align: middle;
}

@media (max-width: 4130px) {
    .hero-box.news {
        max-width: 3600px !important;
    }
}

@media (max-width: 3720px) {
    .hero-box.news {
        max-width: 3200px !important;
    }
}


@media (max-width: 3300px) {
    .hero-box.news {
        max-width: 2800px !important;
    }
}

@media (max-width: 2900px) {
    .hero-box.news {
        max-width: 2400px !important;
       
    }
}

@media (max-width: 2500px) {
    .hero-box.news {
        max-width: 1950px !important;
      
        
    }
}

@media (max-width: 1600px) {
    .hero-box.news {
        max-width: 1200px !important;
        
    }
}

@media (max-width: 1000px) {
    .hero-box.news {
        max-width: 1200px !important;
        padding-left: 0 !important;
        padding-top: 30px
        
    }
}


.blade-popup-content {
    max-width: 1100px;
}

.blade-popup.popup-xs .blade-popup-content {
    max-width: 400px;
    width: 400px;
}

.blade-popup.popup-sm .blade-popup-content {
    max-width: 600px;
    width: 600px;
}

.blade-popup.popup-md .blade-popup-content {
    max-width: 750px;
    width: 750px;
}

.blade-popup.popup-lg .blade-popup-content {
    width: 90%;
    max-width: 2000px !important;
}


.blade-popup-content.dark {
    border: 1px solid #444;
    background-color: #222;
    color: #f0f1f3;
}

.blade-popup-content.grey {
    background-color: #424242;
    color: #f0f1f3;
}


.choice-spacer {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 10%;
    max-width: 450px;
    min-height: 175px;
    min-width: 300px;
    padding: 0px 15px 30px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}


@media (max-width: 3300px) {
    .choice-spacer {
        width: 12.5%;
    }
}

@media (max-width: 2700px) {
    .menu-docked-collapsed .choice-spacer,
    .menu-docked .choice-spacer {
        width: 16.6%;
    }
}


@media (max-width: 2500px) {
    .choice-spacer {
        width: 16.6%;
    }
}

@media (max-width: 2100px) {
    .choice-spacer {
        width: 20%;
    }

    .menu-docked .choice-spacer {
        width: 25%;
    }
}


@media (max-width: 1920px) {
    .menu-docked-collapsed .choice-spacer {
        width: 25%;
    }
}


@media (max-width: 1450px) {
    .menu-docked .choice-spacer {
        width: 33.33%;
    }
}

@media (max-width: 1300px) {
    .menu-docked-collapsed .choice-spacer {
        width: 33.33%;
    }
}


.choice-link-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 10px 0px 0px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

    .choice-link-list.short {
        padding-left: 0px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

.choice-link-list-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    padding-top: 10px;
    padding-bottom: 5px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #999;
    line-height: 1.3em;
    font-weight: 600;
}

.link-list-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    min-height: 20px;
    padding-right: 15px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

.choice-icon {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 40px;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 30px;
    background-color: #007FAD;
}

    .choice-icon.orange {
        background-color: #EE7017;
    }

    .choice-icon.lblue {
        position: relative;
        background-color: #0093C9;
    }

    .choice-icon.green {
        background-color: #018748;
    }

    .choice-icon.hearst {
        background: #4e76a1;
    }

    .choice-icon.gold {
        background-color: #eaab00;
    }

    .choice-icon.lg {
        width: 96px;
        height: 96px;
        margin: 0px;
        border-radius: 90px;
    }

    .choice-icon.over {
        width: 200px;
        height: 200px;
        border-radius: 100px;
    }

.dash-header {
    position: static;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 60px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-content: space-around;
    -ms-flex-line-pack: distribute;
    align-content: space-around;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-bottom: 1px none #ddd;
    background-color: transparent;
    color: #000;
}

.dash-page-title {
    display: block;
    padding-right: 25px;
    padding-bottom: 10px;
    padding-left: 25px;
    color: #fff;
    font-size: 1.75em;
    font-weight: 600;
    text-align: left;
}

    .dash-page-title.news {
        height: 60px;
        padding-left: 35px;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

.dash-page-title-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    min-height: 30px;
    padding-right: 25px;
    padding-left: 25px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    color: #f0f1f3;
    text-align: center;
}

    .dash-page-title-text.news {
        width: 100%;
        max-width: 600px;
        padding-left: 35px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        font-size: 1em;
        text-align: left;
    }

.right-action {
    display: flex;
    padding-right: 10px;
    justify-content: flex-end;
    flex: 2;
}

.box-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 60px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    color: #36434E;
    font-weight: 500;
}

    .box-title.news {
        padding-left: 35px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        color: #fff;
    }

    .box-title.dark {
        color: #f0f1f3;
    }

    .box-title.grey {
        color: #f0f1f3;
    }

.hero-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

    .hero-box.news {
        width: 97%;
        max-width: 4000px;
        padding-bottom: 20px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        background-image: none;
        background-position: 0px 0px;
        background-size: auto;
        background-repeat: repeat;
        background-attachment: scroll;
    }

    .hero-box.loading {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        background-color: #323232;
        color: #f4f4f4;
        font-weight: 300;
    }

.news-action {
    padding-left: 35px;
}

.featured-new-box {
    padding-right: 50px;
    padding-left: 50px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

    .featured-new-box.news {
        min-height: 275px;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        /* border-radius: 10px; */
        background-position: 0px 0px, 0px 0px, 0px 0px, 0px 0px, 50% 50%;
        background-size: auto, auto, auto, auto, cover;
        background-repeat: no-repeat;
        color: #fff;
    }

.hover-text {
    position: absolute;
    left: -10px;
    bottom: -15px;
    display: none;
    width: 75px;
    min-height: 22px;
    min-width: 65px;
    padding-right: 5px;
    padding-left: 5px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-radius: 2px;
    background-color: #000;
    color: #fff;
    font-size: 0.7em;
    font-weight: 400;
}

.icon12 {
    width: 12px;
    height: 12px;
}

.menu-space-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-right: 5px;
    margin-left: 3px;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.menu-space-title-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-right: 5px;
    padding-left: 7px;
    color: #ccc;
    font-size: 0.7em;
    font-weight: 700;
    text-transform: uppercase;
}

    .menu-space-title-text.green {
        color: #666;
    }

    .menu-space-title-text.blue {
        color: #666;
    }

.tab-section-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    padding-bottom: 5px;
    padding-left: 10px;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    border-bottom: 1px solid #ccc;
    font-weight: 700;
}

    .tab-section-title:hover {
        background-color: #F6F6F6;
    }

    .tab-section-title.dark {
        border-color: #444;
        background-color: #111;
        color: #f0f1f3;
        font-weight: 600;
    }

    .tab-section-title.blue {
        background-color: #fff;
    }

    .tab-section-title.grey {
        background-color: #404040;
        color: #f0f1f3;
    }

    .tab-section-title.green {
        background-color: #fff;
    }

.tab-link-details {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    min-height: 32px;
    padding-left: 10px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 1em;
}

.all-app-panel {
    position: fixed;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: 0%;
    z-index: 20;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -ms-grid-row-align: stretch;
    align-self: stretch;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-areas: ". . ." ". . ." ". . .";
    -ms-grid-columns: 200px 0px auto 0px 1fr;
    grid-template-columns: 200px auto 1fr;
    -ms-grid-rows: 90px 0px minmax(auto, 0.5fr) 0px auto;
    grid-template-rows: 90px minmax(auto, 0.5fr) auto;
    background-image: none;
    box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.4);
    color: #333;
}

.all-app-block {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 10px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-content: space-around;
    -ms-flex-line-pack: distribute;
    align-content: space-around;
}

.all-apps-item {
    position: static;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 350px;
    margin-right: 0px;
    padding: 10px 20px 10px 10px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #333;
    font-size: 13px;
}

    .all-apps-item:hover {
        background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.1)));
        background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1));
    }

    .all-apps-item.dark {
        color: #fff;
    }

        .all-apps-item.dark:hover {
            background-color: rgba(0, 0, 0, 0.2);
        }

.all-apps-item-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}


.close-all-apps {
    /* position: absolute;
  left: auto;
  top: 0%;
  right: 0%;
  bottom: auto; */
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 40px;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

    .close-all-apps:hover {
        background-color: #c00;
    }

        .close-all-apps:hover img, .close-side-panel.red:hover img, .q-link.red:hover img {
            filter: brightness(500%);
        }

.app-block-header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 25px;
    margin-bottom: 10px;
    padding-right: 10px;
    padding-left: 10px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #333;
    font-size: 0.7em;
    font-weight: 600;
    text-transform: uppercase;
}

    .app-block-header.dark {
        color: #aaa;
    }

    .app-block-header.grey {
        color: #ccc;
    }

.app-block-line {
    height: 1px;
    margin-left: 10px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-top: 1px solid #ccc;
}

    .app-block-line.dark {
        border-top-color: #666;
        color: #666;
    }

.form {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.field-box {
    width: 100%;
    min-height: 50px;
    min-width: 200px;
    margin-right: 25px;
    margin-bottom: 15px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

.text {
    margin-bottom: 20px;
}

.all-apps-header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 10px;
    padding-left: 10px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.25em;
    font-weight: 600;
}

.all-apps-title {
    white-space: nowrap;
    margin: auto;
    padding-right: 15px;
}

.all-apps-empty {
    width: 100%;
    text-align: center;
}

.env-select {
    position: absolute;
    overflow: hidden;
    top: 40px;
    width: 225px;
    height: 40px;
    font-size: 13px;
    background-color: #fff;
    border-right: 1px solid #ddd;
    padding: 5px;
    z-index: 7;
}

.blade-content.default .env-select {
    background-color: #F6F6F6;
}

.blade-content.dark .env-select {
    background-color: #111;
    border-right-color: #444;
}

.blade-content.grey .env-select {
    background-color: #404040;
    border-right-color: #555;
}


.env-select a {
    position: relative;
    display: block;
    min-width: 215px;
    min-height: 30px;
    height: 30px;
    padding: 5px 5px 5px 15px;
    border-radius: 4px;
    font-size: 14px;
}

    .env-select a:hover {
        filter: brightness(110%);
    }

    .env-select a img {
        float: right;
        width: 20px;
        height: 20px;
    }

.env-select + .tabs-menu {
    top: 80px !important;
    height: calc(100vh - 170px);
    height: calc(var(--app-height) - 170px);
}


.env-select-options {
    min-width: 215px;
    font-size: 14px !important;
}

    .env-select-options.selectedEnvOption {
        background-color: #CBD0D4;
        font-weight: bold;
    }

        .env-select-options.selectedEnvOption.dark {
            background-color: #242424;
        }

.theme-select-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 10px;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

.theme-select-option {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 50px;
    height: 50px;
    min-height: 50px;
    min-width: 50px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #444;
    border-radius: 25px;
    background-color: #d8d8d8;
}

    .theme-select-option.dark {
        border: 1px solid #444;
        background-color: #111;
    }

    .theme-select-option.dblue {
        background-color: #007FAD;
    }

    .theme-select-option.green {
        background-color: #018748;
    }

    .theme-select-option.grey {
        border-color: #d8d8d8;
        background-color: #444;
    }

.radio-field {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 0px;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

    .radio-field .MuiIconButton-root {
        padding: 3px 6px !important;
    }

    .radio-field .MuiFormControlLabel-root {
        padding-right: 20px;
    }

    .radio-field.top {
        margin-top: 10px;
    }

.check-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

    .check-row.sub {
        padding-left: 20px;
    }

.icon-10 {
    height: 10px;
    min-width: 10px;
}

.icon16 {
    width: 16px;
    height: 16px;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
}

    .icon16.right {
        margin-right: 3px;
    }

.form-label {
    display: flex;
    width: 100%;
    margin-top: 10px;
    color: rgba(0, 0, 0, 0.75);
    font-size: 13px;
    line-height: 1.2em;
    font-weight: 500;
    min-height: 20px;
    flex-direction: row;
    align-items: flex-end;
}

    .form-label > span {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .form-label.dark {
        color: #8c8c8c;
    }

    .form-label.grey {
        color: hsla(0, 0%, 100%, 0.75);
    }

    .form-label.grey {
        color: #f0f1f3;
    }

    .form-label.grey {
        color: #f0f1f3;
    }

.icon48 {
    width: 48px;
    height: 48px;
}

.overviewWrapper {
    min-height: calc(100vh - 180px);
    min-height: calc(var(--app-height) - 180px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.overview-container {
    display: flex;
    width: 100%;
    font-size: 2.5em;
    font-weight: 600;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.overview-title {
    line-height: initial;
    padding: 20px 0px;
}

.overview-summary {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-top: 25px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.panel-row-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    color: #333;
}

    .panel-row-text.dark {
        color: #f0f1f3;
    }

    .panel-row-text.grey {
        color: #f0f1f3;
        font-weight: 400;
    }

.error-container {
    margin: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
}

.error-block {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
}


.error-message {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-left: 40px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.error-container.small .error-message {
    display: none;
}

.error-message-title {
    margin-bottom: 15px;
    font-size: 2.1em;
    line-height: 1.3em;
    font-weight: 600;
}

    .error-message-title.dark {
        color: #f0f1f3;
    }


.error-message-text {
    margin-bottom: 15px;
    font-size: 1.2em;
}


.error-container img {
    width: 130px;
    height: 130px;
}

.error-container.comp .error-message-title {
    margin-bottom: 5px;
    font-size: 1.2em;
    font-weight: 500;
}

.error-container.comp .error-message-text {
    font-size: 13px;
}

.error-container.comp .empty-img {
    width: unset;
    height: unset;
    max-width: 100px;
    max-height: 100px;
}


.panel-trigger {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    padding-right: 5px;
    padding-left: 5px;
    align-items: center;
}

.panel-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 50px;
    padding-left: 5px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

    .panel-row:hover {
        background-color: rgba(0, 0, 0, 0.2);
    }

    .panel-row.dark:hover {
        background-color: #444;
    }

.panel-empty-block {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 30px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #666;
    width: 100%;
}

    .panel-empty-block.dark {
        color: #f0f1f3;
    }

    .panel-empty-block.grey {
        color: #f0f1f3;
    }


.empty-img {
    width: 150px;
    height: 150px;
}

    .empty-img.comp {
        width: 50px;
        height: 50px;
    }

    .empty-img.row {
        width: 20px;
        height: 20px;
    }

.notification-img {
    width: 100px;
    height: 100px;
}


.empty-title {
    margin-top: 40px;
    margin-bottom: 20px;
    color: #666;
    font-size: 1.5rem;
}

.formColumnWrapper {
    min-width: 115px;
}

.row > .formColumnWrapper > .bladeComponentWrapper {
    /* border: 1px solid rgb(221, 221, 221); */
    box-shadow: 0px 1px 1px 0 rgba(0, 0, 0, 0.3);
    margin-bottom: 16px;
}

    .row > .formColumnWrapper > .bladeComponentWrapper.dark {
        background-color: #333;
    }

    .row > .formColumnWrapper > .bladeComponentWrapper.grey {
        background-color: #555;
    }

    .row > .formColumnWrapper > .bladeComponentWrapper.blue {
        background-color: #edf0f5;
    }

    .row > .formColumnWrapper > .bladeComponentWrapper.green {
        background-color: #f7f7f7;
    }

.row > .formColumnWrapper:not(:only-child) > .bladeComponentWrapper > .bladeComponent > .loading-panel {
    padding: 40px;
}

.row > .formColumnWrapper:only-child > .bladeComponentWrapper {
    border: none;
    box-shadow: none;
    margin-bottom: 0;
    background-color: transparent;
}

/* Css for table header when table is in a blade with multiple components */
.row > .formColumnWrapper:not(:only-child) > .bladeComponentWrapper .fixedHeader.dark {
    background-color: #333;
}

.row > .formColumnWrapper:not(:only-child) > .bladeComponentWrapper .fixedHeader.grey {
    background-color: #555;
}

.row > .formColumnWrapper:not(:only-child) > .bladeComponentWrapper .fixedHeader.blue {
    background-color: #edf0f5;
}

.row > .formColumnWrapper:not(:only-child) > .bladeComponentWrapper .fixedHeader.green {
    background-color: #f7f7f7;
}

/* Css for table header when table is in a blade alone without multiple components */
.row > .formColumnWrapper:only-child > .bladeComponentWrapper .fixedHeader.dark {
    background-color: #111;
}

.row > .formColumnWrapper:only-child > .bladeComponentWrapper .fixedHeader.grey {
    background-color: #404040;
}

.row > .formColumnWrapper.BladeFormFilter {
    padding-left: 5px;
}

/* Css for graph when displayed in a popup */
.row > .formColumnWrapper > .graphHeader.dark,
.row > .formColumnWrapper > .graphContainer.dark {
    background-color: #111;
}

/* Css for graph when displayed in a popup */
.row > .formColumnWrapper > .graphHeader.grey,
.row > .formColumnWrapper > .graphContainer.grey {
    background-color: #333;
}

.graphContainer.dark text {
    fill: #CBD0D4
}

.bladeComponentWrapper {
    max-width: 100%;
}

.field-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    min-height: 40px;
    padding: 9px 10px 0px;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    border: 1px none #ddd;
    border-radius: 4px;
    background-color: rgba(0, 0, 0, 0.03);
    overflow-x: hidden;
    font-size: 13px !important;
    border: rgb(221, 221, 221) 1px solid;
}

    .field-text.grey {
        background-color: #333;
        border: #666 1px solid;
    }

    .field-text.dark {
        background-color: rgba(0, 0, 0, 0.3);
        color: #f0f1f3;
        border: rgb(68, 68, 68) 1px solid;
    }

    .field-text.locked {
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .field-text.special {
        min-height: 50px;
        padding-left: 0px;
        background-color: transparent;
        font-size: 2em;
        font-weight: 700;
    }

    .field-text.search-field {
        min-height: 30px;
    }

.formProgressBar {
    min-height: 40px;
    border-radius: 4px;
    border: rgb(221, 221, 221) 1px solid;
}

    .formProgressBar > div {
        height: 38px;
    }

    .formProgressBar.grey {
        background-color: #333;
        border: #666 1px solid;
    }

    .formProgressBar.dark {
        background-color: rgba(0, 0, 0, 0.3);
        color: #f0f1f3;
        border: rgb(68, 68, 68) 1px solid;
    }


.modal {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 12;
    width: 100%;
    min-height: 100vh;
    min-height: var(--app-height);
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0.4)));
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));
}

    .modal.light {
        background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(240, 241, 243, 0.3)), to(rgba(240, 241, 243, 0.3)));
        background-image: linear-gradient(180deg, rgba(240, 241, 243, 0.3), rgba(240, 241, 243, 0.3));
    }

.modal-box {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    width: 100%;
    height: auto;
    max-width: 600px;
    min-height: 300px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    border-radius: 4px;
    background-color: #fff;
    box-shadow: 7px 7px 20px 0 rgba(0, 0, 0, 0.4);
    color: #333;
    font-weight: 400;
}

.modal-title {
    font-size: 1.75em;
}

.panel-content .modal-content {
    height: calc(100vh - 150px) !important;
    height: calc(var(--app-height) - 150px) !important;
}

.panel-closer {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.app-panel-contents {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 775px;
    padding: 20px;
    margin-left: 200px;
    margin-top: 60px;
    max-height: calc(100vh - 80px);
    max-height: calc(var(--app-height) - 80px);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    border: 1px solid #ddd;
    border-radius: 10px;
    background-color: #fff;
    box-shadow: 4px 4px 10px 0 rgba(0, 0, 0, 0.4);
}

    .app-panel-contents.collapsed {
        margin-left: 50px;
    }

    .app-panel-contents.dark {
        grid-auto-columns: 1fr;
        -ms-grid-columns: 1fr 1fr;
        grid-template-columns: 1fr 1fr;
        -ms-grid-rows: auto auto;
        grid-template-rows: auto auto;
        border-color: #444;
        background-color: #333;
        color: #f0f1f3;
    }

    .app-panel-contents.grey {
        grid-auto-columns: 1fr;
        -ms-grid-columns: 1fr 1fr;
        grid-template-columns: 1fr 1fr;
        -ms-grid-rows: auto auto;
        grid-template-rows: auto auto;
        border-color: #444;
        background-color: #333;
        color: #f0f1f3;
    }

.modal-footer {
    position: relative;
    display: flex;
    height: auto;
    min-height: 70px;
    margin-top: 15px;
    padding: 15px 28px;
    justify-content: flex-end;
    align-items: center;
}

.panel .modal-footer {
    padding: 15px 10px 0px 0px;
}

.form-block {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 0px;
}

.form-divider {
    width: 100%;
    height: 3px;
    margin: 5px 0px;
    border-bottom: 1px solid #ddd;
}

.form-sub-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    min-height: 40px;
    margin-top: 20px;
    margin-bottom: 10px;
    padding-right: 0px;
    padding-bottom: 0px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #ddd;
    color: rgba(0, 0, 0, 0.85);
    font-size: 1em;
    font-weight: 500;
}

    .form-sub-title.grey, .form-divider.grey {
        border-bottom-color: #666;
        color: hsla(0, 0%, 100%, 0.9);
    }

    .form-sub-title.dark, .form-divider.dark {
        border-bottom-color: #444;
        color: #f0f1f3;
    }

.icon18 {
    width: 18px;
    height: 18px;
}

.news-slider {
    min-height: 325px;
    max-height: 425px;
    border-radius: 20px;
}

.slider-mask {
    background-color: #111;
}

.red-badge {
    position: absolute;
    left: auto;
    top: 25%;
    right: 25%;
    bottom: auto;
    width: 10px;
    height: 10px;
    border-radius: 10px;
    background-color: red;
}

.tab-menu-closer {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 10;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 225px;
    height: 50px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 10px;
    cursor: pointer;
    border-radius: 0;
    border-right: 1px solid #ddd;
    background-color: #F6F6F6;
}

    .tab-menu-closer.grey {
        border-right-color: #555;
        background-color: #404040;
    }

    .tab-menu-closer.dark {
        border-right-color: #444;
        background-color: #111;
    }

    .tab-menu-closer.blue {
        background-color: #fff;
    }

    .tab-menu-closer.green {
        background-color: #fff;
    }

.invert {
    filter: invert(.8);
}
  .invert-dashobard{
    filter: invert(.3);
    margin-left: 15px;
  }
  .invert-dashobard-showNews{
    filter: invert(.3);

  }

    .invert.dark {
        filter: invert(.0);
    }

    .invert.grey {
        filter: invert(.0);
    }

    .invert.default {
        filter: invert(.0);
    }

/**** INFO Notification ******/
.info-notification {
    background-color: #C0EAFA;
    border: 1px solid #3E6F7E;
    display: block;
}


    .info-notification .icon {
        float: left;
        height: 24px;
        width: 24px;
        background-image: url('/images/notification/info.png');
        background-repeat: no-repeat;
        margin-right: 20px;
        margin-top: 10px;
    }

    .info-notification .title {
        color: #28769A;
        font-size: 14px;
    }

    .info-notification .desc {
        color: #000000;
        font-size: 13px;
    }

/**** ERROR Notification ******/
.error-notification {
    background-color: #FFD3D4;
    border: 1px solid #4B2927;
    display: block;
}

    .error-notification .icon {
        float: left;
        height: 24px;
        width: 24px;
        background-image: url('/images/notification/error.png');
        background-repeat: no-repeat;
        margin-right: 20px;
        margin-top: 10px;
    }

    .error-notification .title {
        color: #6C1C11;
        font-size: 13px;
        font-weight: bold;
    }

    .error-notification .desc {
        color: #000000;
        font-size: 11px;
    }

.Cursor_Hand {
    cursor: pointer;
}

.menu-items-wrapper {
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.menu-collapse {
    position: absolute;
    bottom: 0;
    left: 0;
    font-size: 13px;
    text-align: center;
    width: 100%;
    height: 50px;
    background-color: #536372;
    color: #f2f2f2;
    border-top: 1px solid #8697A7;
}

    .menu-collapse div {
        margin-top: 15px;
        margin-left: -19px;
    }

    /* .menu-collapse:hover {
      background-color: hsla(0, 0, 0, 0.1) !important;
  } */

    .menu-collapse.grey {
        background-color: #303030;
        border-top: 1px solid #555;
    }

    .menu-collapse.dark {
        background-color: #232323;
        border-top: 1px solid #444;
    }

    .menu-collapse.green {
        color: #0c0707;
        background-color: #f7f7f7;
        border-top: 1px solid #ddd;
    }

    .menu-collapse.blue {
        color: #0c0707;
        background-color: #f7f7f7;
        border-top: 1px solid #ddd;
    }

.menu-li .sub {
    padding-left: 15px !important;
}

.tile-no-desc {
    padding-top: 10px;
}

/*** LEFT Navigation CSS Rules */

.btnTransparent {
    border: 0;
    background-color: Transparent;
    display: inline-block;
    color: initial;
    padding-left: 0px;
}

.loading-spinner-wrapper {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    overflow: hidden;
    display: flex;
    position: absolute;
    z-index: 15;
    background-color: rgba(66, 66, 66, 0.3);
}

.bladeForm.dark .loading-spinner-wrapper {
    background-color: rgba(0, 0, 0, 0.3);
}

.loading-spinner {
    border: 3px solid #f3f3f3;
    border-radius: 50%;
    border-top: 3px solid #52565b;
    width: 40px;
    height: 40px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

.dashboardPadding{
    margin-bottom: "55px";
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.loading-panel {
    padding-top: 35vh;
    overflow: hidden;
    height: -webkit-fill-available;
    height: -moz-available;
    background-color: transparent;
}
.img-Icon{
    height:35px;
    width:35px;
    margin-top: -9px;
}
.bladeForm {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-bottom: 15px;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.bladeFormV2 {
    display: block;
    overflow-x: hidden;
    padding: 0px 8px;
    width: 100%;
}

.blade-popup .bladeFormV2, .panel .bladeFormV2 {
    width: 100%;
    overflow-x: unset;
}

.bladeForm.dark input {
    background-color: #111;
    color: #f0f1f3;
}

.bladeForm .bladePopup-cancel {
    float: right;
    background-color: white;
}

.bladeForm .row:last-child .formColumnWrapper:only-child > button {
    float: unset;
    margin: 20px auto;
}

.panel-content.dark input[type=text] {
    background-color: #000;
    color: #ccc;
}

.textarea-input {
    width: 100%;
    cursor: auto;
    resize: none;
    max-height: calc(100vh - 300px);
    max-height: calc(var(--app-height) - 300px);
    border-radius: 3px;
}

.blade-popup .textarea-input {
    max-height: calc(100vh - 620px);
    max-height: calc(var(--app-height) - 620px);
    min-height: 45px;
}

@media (max-height: 1300px) {
    .blade-popup .textarea-input {
        max-height: calc(100vh - 580px);
        max-height: calc(var(--app-height) - 580px);
    }
}

@media (max-height: 950px) {
    .blade-popup .textarea-input {
        max-height: calc(100vh - 510px);
        max-height: calc(var(--app-height) - 510px);
    }
}


.textarea-input::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.textarea-input::-webkit-scrollbar-track {
    background: transparent;
}

.textarea-input::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 5px;
}

    .textarea-input::-webkit-scrollbar-thumb:hover {
        background: #555;
    }


.loadable .bladeForm.dark .w-select {
    background-image: none;
    background-color: #111;
    color: #ccc;
}

.slideOutForm {
    background-color: rgba(0, 0, 0, 0.35);
}

    .slideOutForm .bladeForm.dark .w-select {
        background-image: none;
        background-color: #000;
        color: #ccc;
    }

.requiredLabel {
    position: absolute;
    left: 30px;
    bottom: 60px;
    font-size: 12px;
}

.panel .requiredLabel {
    left: 10px;
}


.popup-blade .requiredLabel,
.popup-app .requiredLabel {
    bottom: 30px;
}

.requiredLabel2 {
    font-size: 0.8em;
    position: absolute;
    left: 30px;
    bottom: 60px;
    font-size: 0.8em;
}

.filterTag {
    border: 1px solid #ddd;
    margin-top: 4px;
    margin-left: 10px;
    margin-right: 10px;
    padding: 7px 3px 0px 13px;
    border-radius: 30px;
    height: 34px;
    font-size: 13px;
}

    .filterTag.client {
        width: 350px !important;
        margin-bottom: 10px !important;
        margin-top: 24px;
        margin-left: 5px;
    }

    .filterTag.grey {
        border: 1px solid #666;
    }

    .filterTag.dark {
        border: 1px solid #444;
        background-color: #111;
    }


.filterSubTagLabel {
    break-before: always;
}

.filterTagLabel, .filterSubTagLabel {
    margin-top: -1px;
    float: left;
    max-width: 80px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.filterSubTagLabel {
    margin-top: 0px;
}



.filterTagContent {
    color: #536372;
    font-weight: normal;
    padding: 0px 5px 0 5px;
    font-size: 13px !important;
    float: left;
    font-weight: bold;
    margin-top: -1px;
}

    .filterTagContent .text-field {
        padding-right: 20px !important;
    }

    .filterTagContent div {
        cursor: pointer;
    }

.filterTagLabel:empty + .filterTagContent {
    padding-left: 0;
}

.filterTagContent.dark {
    color: #ddd;
}

.filterTagContent.grey {
    color: #ddd;
}

.filterTag input {
    border-style: none;
    width: 55px;
    height: 20px !important;
    text-align: center;
    padding: 0 !important;
    margin: 0 !important;
    text-overflow: ellipsis;
}

    .filterTag input[type="text"] {
        text-align: left;
        width: 150px;
    }

.filterTag .autocomplete {
    padding-right: 20px !important;
    width: 200px !important;
}

.companyDropdown {
    margin-right: 5px;
}

.filterTag .text-field {
    min-width: auto;
    min-height: 20px;
}

.filterTag select {
    border-style: none;
    font-size: 13px !important;
    max-height: 17px;
}

.filterTag .w-underline {
    height: 18px;
    background-image: none;
}

.filterTag .w-select.dark {
    color: #ddd;
    background-color: #111;
}

.w-placeholder {
    color: #000;
    font-weight: bold;
    font-size: 13px !important;
}

    .w-placeholder.dark {
        color: #fff;
    }

    .w-placeholder.grey {
        color: #fff;
    }

.w-placeholder-content {
    padding-right: 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 250px;
}

.blade-item-action-bar .w-placeholder {
    display: inline-block;
    flex: auto;
    min-width: 10px;
    margin-right: 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.filterTag .text-field.grey {
    background-color: transparent;
}

    .filterTag .text-field.grey.w-select:focus {
        background-color: #404040 !important;
    }

.filterTag .text-field.search.grey:hover {
    background-color: transparent;
}

.filterTagClose {
    margin-right: 7px;
    margin-top: -2px;
    cursor: pointer;
    color: #536372;
}

    .filterTagClose img {
        width: 15px;
        height: 15px;
    }

    .filterTagClose.dark {
        filter: brightness(1.5);
    }

    .filterTagClose.grey {
        filter: brightness(1.5);
    }

    .filterTagClose:hover {
        filter: brightness(1.1);
    }

    .filterTagClose.grey:hover {
        filter: brightness(2.0);
    }

    .filterTagClose.dark:hover {
        filter: brightness(2.0);
    }

.searchTag {
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 5px;
    padding-top: 5px;
    padding-left: 10px;
    display: flex;
    border-radius: 7px;
    min-width: 90px;
    height: 35px;
}

.blade-item-action-bar .searchTag img {
    margin-right: 5px;
}

.blade-item-action-bar .searchTag:not(.open) {
    max-width: 90px;
}

.blade-item-action-bar .searchTag.hasValue {
    max-width: 120px;
}

.blade-item-action-bar .searchTag input {
    margin-top: 2px !important;
    width: calc(100% - 45px) !important;
    max-width: calc(100% - 45px) !important;
}

.blade-item-action-bar .searchTag.open {
    width: 100%;
    margin-right: 10px;
    max-width: 200px;
}

.filterToggle {
    display: block;
    padding-top: 0px;
    min-width: 65px;
}

    .filterToggle.mobile {
        display: none;
    }

.filterOption {
    margin: 0 !important;
}

    .filterOption:first-child .filterTag {
        margin-left: 0;
    }

    .filterOption .q-link {
        min-height: 35px;
    }

    .filterOption .filterTag {
        display: flex;
    }

.filterTag.dynamicFilter {
    display: table;
    white-space: nowrap;
}

    .filterTag.dynamicFilter > div {
        display: table-cell;
    }

    .filterTag.dynamicFilter br {
        display: none;
    }

    .filterTag.dynamicFilter .autoCompleteList * {
        display: block;
    }

    .filterTag.dynamicFilter.mobileDynFilter {
        height: unset;
    }

        .filterTag.dynamicFilter.mobileDynFilter br {
            display: initial;
        }

    .filterTag.dynamicFilter .filterTagContent br:first-child {
        display: none;
    }

    .filterTag.dynamicFilter.mobileDynFilter {
        border-radius: 18px;
    }


.filterTagCloseWrapper {
    vertical-align: top;
    height: 15px;
    line-height: 1px;
    padding-top: 2px;
}


.autocomplete-clear {
    float: right;
    position: relative;
    top: -17px;
    width: 15px;
}

.input-clear {
    float: right;
    position: relative;
    top: -18px;
    width: 15px;
}

.move {
    cursor: move;
}

.blade-popup:not(.popup-full):not(.popup-blade):not(.popup-app) .blade-header {
    cursor: move;
}

.loading-dots:after {
    content: " ...";
    animation: dots 1s steps(5, end) infinite;
}

@keyframes dots {
    0% {
        opacity: .2;
    }

    20% {
        opacity: 1;
    }

    100% {
        opacity: .2;
    }
}

.loading-spinner-wrapper .loading-dots,
.blade-popup.loading .loading-dots,
.blade-popup.grey .loading-dots,
.blade-popup.dark .loading-dots {
    color: #FFF !important
}

.mui-chip {
    margin-left: 1px;
    margin-right: 1px;
}

    .mui-chip.grey,
    .mui-chip.dark {
        color: rgba(0, 0, 0, 0.87);
        background-color: #e0e0e0;
    }

.mui-select {
    font-size: 13px !important;
    font-weight: 700 !important;
    padding-top: 1px !important;
    padding-bottom: 0 !important;
    height: 19px !important;
    line-height: 19px !important;
}

    .mui-select.grey {
        color: white;
    }

    .mui-select.dark {
        color: white;
    }

.mui-select-icon {
    color: #666666 !important;
}

.input-date-range .DayPicker-Day--selected:not(.DayPicker-Day--start):not(.DayPicker-Day--end):not(.DayPicker-Day--outside) {
    background-color: #f0f8ff !important;
    color: #007FAD;
}

.input-date-range .DayPicker.dark .DayPicker-Day--selected:not(.DayPicker-Day--start):not(.DayPicker-Day--end):not(.DayPicker-Day--outside) {
    background-color: #323232 !important;
    color: #007FAD;
}

.input-date-range .DayPicker-Day {
    border-radius: 0 !important;
}

.input-date-range .DayPicker-Day--start {
    border-top-left-radius: 50% !important;
    border-bottom-left-radius: 50% !important;
}

.input-date-range .DayPicker-Day--end {
    border-top-right-radius: 50% !important;
    border-bottom-right-radius: 50% !important;
}

.input-date-range .DayPickerInput-Overlay {
    position: fixed !important;
    width: 425px;
    border: 1px solid #ccc;
    border-radius: 5px;
    z-index: 10;
}

.DatePickerInput .DayPickerInput {
    width: 100%;
}

.DayPicker .DayPicker-Body {
    font-size: 13px;
}

.DayPicker.dark {
    background-color: #111;
}

.DayPicker.grey {
    background-color: #404040;
}

.datePreset {
    font-size: 0.85em;
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin: 0;
}

    .datePreset:hover {
        background-color: #ddd;
    }

        .datePreset:hover.grey {
            background-color: #333;
        }

        .datePreset:hover.dark {
            background-color: #444;
        }

.input-date-picker {
    width: 80px !important;
}

    .input-date-picker.lg {
        width: 100px !important;
    }

    .input-date-picker.dark {
        background-color: #111;
    }

    .input-date-picker.grey {
        background-color: #404040;
    }

.input-date-range .DayPickerInput:nth-of-type(2) .DayPickerInput-Overlay {
    margin-left: -91px;
}

.mui-paper {
    z-index: 3;
    min-width: 200px;
    margin-right: 15px;
    /* padding-right: 20px; */
}

.mui-paper-autocomplete {
    z-index: 20 !important;
    background-color: #f9f9f9;
    margin-left: -10px;
}

    .mui-paper-autocomplete.touchDevices {
        margin-left: 0px;
    }

    .mui-paper-autocomplete.dark {
        background-color: #323232;
        color: #fff;
    }

.mui-paper span.mobileOnly {
    padding-left: 10px;
    font-size: 14px;
    font-weight: 500;
}

.mui-paper ul div span.mobileOnly {
    padding-top: 15px;
}


.graph-dropdown {
    min-width: 111px;
    text-align: center;
    cursor: pointer;
    font-size: 13px;
    float: right;
}

.graph-options {
    color: black;
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 110px;
    z-index: 1;
    cursor: pointer;
    font-size: 13px;
}

    .graph-options.dark {
        background-color: #323232;
        color: #ddd;
    }

.graph-item {
    padding: 10px;
}

    .graph-item:hover {
        background-color: #ccc;
    }

    .graph-item.dark:hover {
        background-color: transparent;
        background-image: linear-gradient(180deg, rgba(0, 0, 0, .15), rgba(0, 0, 0, .15));
    }

.graph-dropdown:hover .graph-options {
    display: block;
}

.muibar.dark {
    background-color: #fff;
}

.muicheckbox.dark {
    color: hsla(0, 0%, 80%, .5);
}

.muicheckbox-header.dark {
    color: #ddd;
}

.muiradio-row {
    width: 100%;
}

    .muiradio-row.horizontal {
        display: flex;
    }

.radio-input {
    max-width: 43px;
    width: 43px;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding-left: 2px;
}

    .radio-input.grey {
        background-color: #333;
        border: 1px solid #555;
    }

    .radio-input.dark {
        background-color: #333;
        border: 1px solid #555;
    }

.muiradio input[type="radio"] {
    top: 0;
    left: 0;
    width: 100%;
    cursor: inherit;
    height: 100%;
    margin: 0;
    opacity: 0;
    padding: 0;
    position: absolute;
}

.muiradio > span > svg {
    fill: currentColor;
    width: 1em;
    height: 1em;
    display: inline-block;
    font-size: 24px;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    user-select: none;
    flex-shrink: 0;
}

.muiradio.dark {
    color: #ddd;
}

.muiradio.grey {
    color: #fff;
}

.muiradio.dark + span {
    color: #fff;
}

.muiradio.grey + span {
    color: #ddd;
}

.muiradio.default,
.muiradio.blue,
.muiradio.green {
    color: #323232;
}

span[class*="MuiRadio-colorSecondary"].blue,
span[class*="MuiRadio-colorSecondary"].green,
span[class*="MuiRadio-colorSecondary"].default {
    color: #323232;
}

span[class*="MuiRadio-colorSecondary"].dark {
    color: #ddd;
}

span[class*="MuiRadio-colorSecondary"].grey {
    color: #fff;
}

.muiradio-checked {
    color: rgba(0, 0, 0, 0.54) !important;
}

    .muiradio-checked.dark {
        color: #ddd !important;
    }

    .muiradio-checked.grey {
        color: #fff !important;
    }

    .muiradio-checked.blue {
        color: #09c !important;
    }

    .muiradio-checked.green {
        color: #018748 !important;
    }

.muiradio-row > label > span {
    font-size: 0.875rem;
}

.MuiTouchRipple-root {
    color: #ccc;
}

.MuiTableCell-root .MuiSwitch-root {
    height: 22px !important;
    padding: 5px 9px !important;
}

    .MuiTableCell-root .MuiSwitch-root .MuiButtonBase-root {
        padding: 0px 9px !important;
    }

    .MuiTableCell-root .MuiSwitch-root .MuiTouchRipple-root {
        height: 20px !important;
    }

.MuiSwitch-track {
    background-color: #ccc !important;
}

.MuiSwitch-thumb {
    color: #ddd !important;
}

.Mui-checked .MuiSwitch-thumb {
    color: rgba(0, 147, 201, 1) !important;
}

.mui-paper.dark {
    background-color: #323232;
    color: #fff;
}

    .mui-paper.dark a {
        color: #fff !important
    }

.mui-item.dark {
    color: #ddd;
}

.mui-item-disabled.dark {
    color: #ddd;
}

.toasterMain {
    background-color: #000 !important;
    background: #000 !important
}

.toasterSuccess, .toasterError, .toasterInfo {
    background-color: black !important;
    background: black !important;
    background-repeat: no-repeat !important;
    padding: 10px 12px 10px 45px !important;
    background-size: 24px 24px !important;
    background-position-y: center !important;
    background-position-x: 10px !important;
    z-index: 99;
}

.toasterSuccess {
    background-image: url('/images/check_1.svg') !important;
}

.toasterError {
    background-image: url('/images/alert-outline.svg') !important;
}

.toasterInfo {
    background-image: url('/images/info.svg') !important;
}

.authHeader {
    width: 100%;
    background-color: #323232;
    overflow: hidden;
}

    .authHeader.light {
        background-color: #777;
    }

    .authHeader.blue {
        background-color: #fff;
    }

.authBody {
    width: 100%;
    text-align: center;
    margin-top: 40vh;
}

.auth401.dark {
    color: #ddd;
}


.titleLinkSection {
    text-decoration: none;
}

.tileStar {
    position: absolute;
    right: 5px;
    bottom: 5px;
}

.reactApp {
    display: flex;
    overflow: hidden;
    width: 100%;
    /* height: 100%; */
}

.marginBottom20 {
    margin-bottom: 20px;
}

#BladeWrapper {
    padding-left: 0;
}

    #BladeWrapper.hasMenu {
        padding-left: 225px;
    }

.BladeSectionWrapper {
    padding-left: 0;
}

    .BladeSectionWrapper.hasMenu {
        padding-left: 225px;
    }

div[class*="hidden"] ~ div.tabs-content > div > div#BladeWrapper.hasMenu {
    padding-left: 20px;
}

div[class*="hidden"] ~ div.tabs-content > div > div.BladeSectionWrapper.hasMenu {
    padding-left: 20px;
}

.tab-menu-opener {
    transform: rotate(180deg);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 20px;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 10px;
    cursor: pointer;
}

    .tab-menu-opener:hover {
        background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.1)));
        background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1));
    }

.bladeBodyVH {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.frame-popup-content {
    max-height: 740px;
    min-width: 50vw;
    height: 63vh;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    border: 0;
}

.blade-popup.popup-full .frame-popup-content {
    min-height: calc(100vh - 180px);
    min-height: calc(var(--app-height) - 180px);
}

.blade-popup.popup-full.transparent .frame-popup-content {
    min-width: calc(100vw - 60px);
    min-height: calc(100vh - 145px);
    min-height: calc(var(--app-height) - 145px);
}

.fixedHeader {
    background-color: white;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 5;
}

    .fixedHeader.dark {
        color: #ddd !important;
        background-color: #111111;
        /* border-bottom-color: #e0e0e0 !important; */
    }

    .fixedHeader.grey {
        color: #ddd !important;
        background-color: #404040;
        /* border-bottom-color: #555 !important; */
    }

    .fixedHeader.blue {
        background-color: #fff;
    }

    .fixedHeader.green {
        background-color: #fff;
    }

    .fixedHeader.dark [role="button"]:hover {
        color: #ccc !important;
    }

    .fixedHeader.grey [role="button"]:hover {
        color: #ccc !important;
    }

form .fixedHeader.dark {
    background-color: #222;
}

.panel form .fixedHeader.dark {
    background-color: #333;
}

.panel form .fixedHeader.grey {
    background-color: #323232;
}

.materialTableWrapper {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

    .materialTableWrapper::-webkit-scrollbar {
        width: 10px;
    }

    .materialTableWrapper::-webkit-scrollbar-track {
        background: transparent;
    }

    .materialTableWrapper::-webkit-scrollbar-thumb {
        background: #888;
        border-radius: 5px;
    }

        .materialTableWrapper::-webkit-scrollbar-thumb:hover {
            background: #555;
        }

    .materialTableWrapper .mui-checkbox {
        padding: 0px !important;
    }

    .materialTableWrapper .checkable {
        width: 25px;
        padding: 4px 5px 4px 5px !important;
    }

.formColumnWrapper .materialTableWrapper {
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
}

.MuiTableSortLabel-icon {
    width: 18px !important;
    height: 16px !important;
    opacity: 0;
    transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    margin-left: 4px;
    user-select: none;
    margin-right: 4px;
    font-size: 26px !important;
    fill: #000;
}

.materialTblHeaderRow > th.dark > span > svg.MuiTableSortLabel-icon {
    fill: #fff !important;
}

.materialTblHeaderRow > th.grey > span > svg.MuiTableSortLabel-icon {
    fill: #fff !important;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-corner {
    background-color: transparent;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 5px;
}

    ::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

.action-form {
    margin-bottom: 10px;
    /* height: 50px; */
    padding-left: 5px;
    /* overflow: scroll;
  -webkit-overflow-scrolling: touch; */
}

.formColumnWrapper > .action-form {
    padding-left: 0px;
}

.bladeForm > .row > div:last-child {
    margin: 0;
}

.bladeForm .text-field.search {
    margin: inherit;
    padding-left: 5px;
    border-bottom-color: inherit;
    background-color: transparent;
}

.slideOutForm .panel-content.dark input {
    background-color: #000;
}

.slideOutForm .panel-content.dark textarea {
    background-color: #000;
}

.rowCustom {
    width: 100%;
}

#settings[style^="width: 0px;"] {
    box-shadow: none !important;
}

#settings .settings-form {
    overflow-y: auto;
    height: calc(100vh - 60px);
    height: calc(var(--app-height) - 60px);
    display: flex;
    flex-direction: column;
    flex: 1;
}

.autoCompleteOption {
    font-weight: normal !important;
    border: none !important;
    width: 100%;
    font-size: 14px !important;
    word-wrap: break-word;
    outline: 0;
    white-space: normal;
    min-height: 1em;
    display: inline-block;
    padding: 4px 2em 4px 1em;
    border-bottom: 1px #ddd solid;
    color: rgba(0,0,0,.87);
    box-shadow: none;
    transition: box-shadow .1s ease,width .1s ease;
    cursor: pointer;
    background-color: #fff;
}

    .autoCompleteOption.dark {
        background-color: #323232;
        color: #ddd;
    }

    .autoCompleteOption.highlighted {
        background-color: rgba(217, 230, 255, 1);
    }

        .autoCompleteOption.highlighted.dark {
            background-color: transparent;
            background-image: linear-gradient(180deg, rgba(0, 0, 0, .25), rgba(0, 0, 0, .25));
        }

.strMatch {
    font-weight: normal !important;
    color: #333 !important;
}

    .strMatch.dark {
        color: #ddd !important;
    }

.autoCompleteList {
    background-color: white;
    max-height: 20rem;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    overflow-x: hidden;
    border-top-width: 0;
    outline: 0;
    border-radius: 0 0 .28571429rem .28571429rem;
    transition: opacity .1s ease;
    box-shadow: 0 2px 3px 0 rgba(34,36,38,.15);
    border-color: #96c8da;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-style: solid;
    width: 250px;
    position: absolute;
    z-index: 7;
    margin-right: 25px;
    font-weight: 700;
}

    .autoCompleteList.dark {
        background-color: #111;
        border-color: #666;
    }

    .autoCompleteList.grey {
        background-color: #404040;
        border-color: #666;
    }


.materialTblHeader {
    color: #747474 !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    opacity: 1;
}

    .materialTblHeader .MuiTableSortLabel-root:hover {
        color: #202124;
    }


    .materialTblHeader .checkable {
        width: 25px;
        padding: 4px 5px 4px 5px !important;
    }

    .materialTblHeader:not(.with-help-context) {
        padding-right: 5px !important;
    }


    .materialTblHeader.with-help-context .MuiTableSortLabel-icon {
        margin-left: 23px;
    }

    .materialTblHeader.with-help-context .tooltipIcon {
        position: absolute;
        margin-left: -40px;
    }

.gridSelectActions {
    display: flex;
    align-items: center;
    position: fixed;
    margin-left: 50px;
    height: 33px;
    z-index: 6;
    font-size: 15px;
    white-space: nowrap;
    overflow: hidden;
}

.bladeForm .gridSelectActions {
    position: absolute;
    width: calc(100% - 60px);
}

.gridSelectActions .gridSelectAllActions {
    margin-right: 20px;
}

.gridSelectActions .gridSelectActionsButtons a img {
    vertical-align: bottom;
    max-height: 22px;
}

.gridSelectActions .q-link.dark svg,
.gridSelectActions .q-link.grey svg {
    fill: #fff;
}

.noResultsContainer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.noResultsHeader {
    display: block;
    font-size: 15px;
    margin: 0.8em 0 0.8em 0;
}

.noResultsSubHeader {
    display: block;
    font-size: 13px;
}

.noResultsImg {
    height: 160px;
    width: 100px;
    padding-top: 40px;
    padding-bottom: 20px;
    opacity: 0.5;
}

    .noResultsImg.dark {
        opacity: 1;
    }

    .noResultsImg.grey {
        opacity: 1;
    }

/* css to show ... in the action column in dialogs */

.actionsDialogMenu {
    margin: auto auto;
    width: 100%;
    height: 32px;
    padding: 0px;
}

.MuiTableCell-body.actionIcons {
    height: 32px;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

    .MuiTableCell-body.actionIcons img {
        margin-right: 5px;
    }

.mui-actionIcons img {
    margin-right: 0px;
    min-width: 24px;
}

.mui-actionIcons span {
    margin-right: 10px !important;
}

.materialTblRow .materialTblRowCell:last-child.actionIcons img {
    margin-right: 0px;
}

.materialTblRow .materialTblRowCell:last-child.actionIcons {
    text-align: center;
    min-width: 0px !important;
    padding: 0px !important;
    width: 1px !important;
}

.actionsDialogMenu .q-link {
    height: 32px;
    width: 100%;
    min-width: 32px;
    border-radius: 0px;
}

    .actionsDialogMenu .q-link.grey svg, .actionsDialogMenu .q-link.dark svg {
        fill: #fff;
    }

.materialTblHeader:last-child.columnOnlyView * {
    display: none;
}

.materialTblHeaderRow .header_type_actions:last-child {
    padding-left: 2px !important;
    padding-right: 2px !important;
    text-align: right;
}

.materialTblRow .materialTblRowCell:last-child.actionOnlyView * {
    display: none;
}
/* css to show ... in the action column in dialogs */



.checkboxHeader {
    padding-left: 12px !important;
}

.materialTable {
    border-collapse: separate !important;
}

.materialTblHeaderActive {
    color: #000 !important;
    font-weight: 700;
}

    .materialTblHeaderActive.dark {
        color: white !important;
    }

    .materialTblHeaderActive.grey {
        color: white !important;
    }

.materialTblHeaderRow {
    height: 32px !important;
    font-size: 13px;
}

.materialTblHeaderRow th {
    background-color: #f5f5f5;
    border-top: 1px solid #e0e0e0;
}

.materialTblHeaderRow th:first-child {
    border-top-left-radius: 8px;
}

.materialTblHeaderRow th:last-child {
    border-top-right-radius: 8px;
}

    .materialTblHeaderRow.itemsChecked th:not(:first-child) span,
    .materialTblHeaderRow.itemsChecked th:not(:first-child) svg {
        visibility: hidden !important;
    }

    .materialTblHeaderRow.itemsChecked th {
        background-color: #e5e5e5;
    }

    .materialTblHeaderRow.grey.itemsChecked th {
        background-color: #555;
    }

    .materialTblHeaderRow.dark.itemsChecked th {
        background-color: #333;
    }

    .materialTblHeaderRow.itemsChecked .tooltipIcon {
        visibility: hidden !important;
    }

.clipboard {
    cursor: pointer !important;
}

    .clipboard:hover {
        background-color: hsla(120, 100%, 50%, 0.2) !important;
    }

.clipboardImg {
    opacity: 0;
    pointer-events: none;
}

.clipboard:hover .clipboardImg {
    opacity: 1;
}

.clipboard:hover + .clipboardImg {
    opacity: 1;
}

.clipboardContent {
    display: flex;
    justify-content: space-between;
}

.actionIcons {
    min-width: 120px;
    white-space: nowrap;
}

.materialTblRowCell {
    /*border-bottom: solid 1px #F4E7EB !important;*/
    color: #757575 !important;
    cursor: pointer;
}

    .materialTblRowCell.dark {
        color: #999 !important;
        border-bottom-color: #333;
    }

    .materialTblRowCell.grey {
        color: #CCC !important;
        border-bottom-color: #555;
    }

.materialTblRow {
    min-height: 32px;
    height: 20px !important;
    padding: 5px;
    line-height: 1.4em;
    border-bottom: #DDD 1px solid;
}

    .materialTblRow:not(.hasAction) .materialTblRowCell {
        cursor: default !important;
    }

    .materialTblRow.grey {
        border-bottom: #666 1px solid;
    }

    .materialTblRow.dark {
        border-bottom: #444 1px solid;
    }

.defaultLink {
    font-weight: unset;
}

.materialTblRow.unread .materialTblRowCell {
    color: #000 !important;
    font-weight: 700 !important;
}

.materialTblRow.grey.unread .materialTblRowCell, .materialTblRow.dark.unRead .materialTblRowCell {
    color: #fff !important;
}

.materialTblRow .materialTblRowCell:first-child:not(.grey):not(.dark),
.materialTblRow .materialTblRowCell.checkable + .materialTblRowCell:not(.grey):not(.dark) {
    color: #000 !important;
}

.materialTblRow.unread {
    background-color: #ccc !important;
}

.materialTblRow:hover {
    box-shadow: inset 1px 0 0 #dadce0, inset -1px 0 0 #dadce0, 0 1px 2px 0 rgba(60,64,67,.3), 0 1px 3px 1px rgba(60,64,67,.25);
    border-bottom: #CCC 1px solid;
}

    .materialTblRow:hover + .Mui-selected, .materialTblRow:hover + .materialTblRow.unread {
        box-shadow: 0px -2px 2px rgba(60,64,67,.15);
    }

    .materialTblRow:hover .MuiTableCell-root, .Mui-selected .MuiTableCell-root {
        color: #000 !important;
    }


.materialTblRow.grey.unread {
    background-color: #363636 !important;
}

.materialTblRow.grey:hover {
    box-shadow: inset 1px 0 0 rgba(255,255,255,0.2), inset -1px 0 0 rgba(255,255,255,0.2), 0 0 4px 0 rgba(95,99,104,.6), 0 0 6px 2px rgba(95,99,104,.6);
    border-bottom: #777 1px solid;
}

    .materialTblRow.grey:hover + .Mui-selected.grey, .materialTblRow.grey:hover + .materialTblRow.grey.unread {
        box-shadow: 0px -2px 2px rgba(95,99,104,.45);
    }

    .materialTblRow.grey:hover .MuiTableCell-root, .Mui-selected.grey .MuiTableCell-root, .materialTblRow.grey.unread .MuiTableCell-root {
        color: #fff !important;
    }


.materialTblRow.dark.unread {
    background-color: #2d2d2d !important;
}

.materialTblRow.dark:hover {
    box-shadow: inset 1px 0 0 rgba(255,255,255,0.2), inset -1px 0 0 rgba(255,255,255,0.2), 0 0 4px 0 rgba(95,99,104,.45), 0 0 6px 2px rgba(95,99,104,.45);
    border-bottom: #353535 1px solid;
}

.Mui-selected.dark:hover {
    border-bottom: #444 1px solid;
}

.materialTblRow.dark:hover + .Mui-selected.dark, .materialTblRow.dark:hover + .materialTblRow.dark.unread {
    box-shadow: 0px -2px 3px rgba(95,99,104,.45);
}

.materialTblRow.dark:hover .MuiTableCell-root, .Mui-selected.dark .MuiTableCell-root, .materialTblRow.dark.unread .MuiTableCell-root {
    color: #fff !important;
}


.materialTblRow a:hover {
    text-decoration: underline;
}



.DayPickerInput-Overlay.dark {
    background-color: #111;
}

.DayPickerInput-Overlay.grey {
    background-color: #404040;
}

.DayPicker.dark.DayPicker:not(.DayPicker--interactionDisabled) .DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--selected):not(.DayPicker-Day--outside):hover {
    background-color: #323232;
}

.DayPicker.grey.DayPicker:not(.DayPicker--interactionDisabled) .DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--selected):not(.DayPicker-Day--outside):hover {
    background-color: #323232;
}

.DayPicker.dark .DayPicker-Day--disabled {
    color: #323232;
}

.DayPicker.grey .DayPicker-Day--disabled {
    color: #111;
}

.DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside):not(:hover) {
    background-color: #007FAD !important;
}

.disabled-anchor {
    pointer-events: none;
    opacity: 0.5;
}

.tableActionsStyle {
    color: rgba(0, 0, 0, 0.54);
    flex-shrink: 0;
    position: absolute;
}

.pageNumbers {
    padding-left: 5px;
    padding-right: 5px;
    font-size: 15px;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.54);
}

.pagination.dark button {
    color: #ddd;
}

.pagination.grey button {
    color: #fff;
}

.pagination.dark button:hover {
    background-color: #454545;
    border-radius: 25px;
}

.pagination.grey button:hover {
    background-color: #a3a3a3;
    border-radius: 25px;
}

.paginationCaption {
    font-size: 0.75rem !important;
    line-height: 1.375em !important;
    color: rgba(0, 0, 0, 0.54) !important;
}

    .paginationCaption.dark {
        color: #ddd !important;
    }

    .paginationCaption.grey {
        color: #fff !important;
    }

.color-blue {
    color: #0093C9 !important;
}

#notification_container table tbody tr td {
    white-space: normal !important;
}

.marginLeft20 {
    margin-left: 20px;
}

.marginTop10 {
    margin-top: 10px;
}

.text {
    margin-bottom: 15px;
}

.panel-description {
    padding-left: 8px;
    padding-top: 20px;
    padding-bottom: 20px;
}

.ul {
    margin-bottom: 15px;
}

.trendTile {
    min-height: 125px;
    padding: 4px;
    display: block;
    padding-top: 10px;
    justify-content: center;
    align-items: center;
    vertical-align: top;
    overflow: hidden;
}

.trendSubText {
    margin: 0;
    padding: 0;
    display: inline-block;
    vertical-align: middle;
}

.trendSubValue {
    margin: 0;
    padding: 0;
    display: inline-block;
    padding-left: 3px;
}

.trendValueWrapper {
    padding: 5px;
    margin: 20px;
    display: inline-block;
    margin-bottom: 1px;
}

.trendValue {
    padding: 0;
    margin: 0;
    font-size: 30px;
    font: "Roboto";
    display: inline-block;
    vertical-align: middle;
    min-height: 30px;
}

.trendArrowWrapper {
    padding: 0;
    background: transparent;
    display: inline-block;
    margin-bottom: 1px;
}

.trendGreen {
    margin: 0;
    padding: 0;
    font-size: fontSize;
    color: #14FF00;
    vertical-align: middle;
}

.trendRed {
    margin: 0;
    padding: 0;
    font-size: fontSize;
    color: #FF0000;
    vertical-align: middle;
}

.trendUp {
    transform: rotate(-90deg);
}

.trendDown {
    transform: rotate(90deg);
}

.arrowLarge {
    font-size: 30px !important;
}

.arrowSmall {
    font-size: 16px !important;
}

.app-apps-wrapper {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.small-popup-modal {
    margin: auto;
    top: 35%;
    padding: 2%;
}

    .small-popup-modal p {
        margin-top: 20px;
    }

    .small-popup-modal a {
        margin-left: 23%;
        margin-bottom: 6%
    }

.selected {
    background-color: rgba(0, 0, 0, 0.1);
    font-weight: 700;
}

.notifications-wrapper {
    cursor: default;
    overflow-y: auto;
    height: calc(100vh - 110px);
    height: calc(var(--app-height) - 110px);
    overflow-X: hidden;
    -webkit-overflow-scrolling: touch;
}

.notificationCard {
    width: 94%;
    min-height: 100px;
    margin: 10px;
    border-top: 1px solid #ccc;
    padding: 10px
}

    .notificationCard.dark,
    .notificationCard.grey {
        border-top: 1px solid #666;
    }

    .notificationCard div:first-child {
        width: 100%;
        height: 25px;
        position: relative;
    }

        .notificationCard div:first-child div {
            position: absolute;
            font-size: 18px;
            font-weight: bold;
            top: 2px;
            left: 0px;
            padding-right: 30px;
            width: 100%;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis
        }

        .notificationCard div:first-child img {
            float: left
        }

        .notificationCard div:first-child span img {
            float: unset;
            position: absolute;
            cursor: pointer;
            top: -2px;
            right: 0px;
            width: 24px;
            height: 24px;
        }

    .notificationCard div:last-child {
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.slideOutTitle {
    text-overflow: ellipsis;
    max-width: 315px;
    overflow: hidden;
    height: 25px;
}

.bladeFormComponent {
    padding-right: 15px;
    overflow-x: auto;
    max-height: calc(100vh - 250px);
    max-height: calc(var(--app-height) - 250px);
}

.transform {
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    margin-left: 15px;
}

.powerbi-wrapper {
    padding-right: 0;
    overflow: hidden;
    width: 99%;
    height: calc(100vh - 240px);
    height: calc(var(--app-height) - 240px);
}

.powerbi-wrapper-nofilter {
    padding-right: 0;
    overflow: hidden;
    width: 99%;
    height: calc(100vh - 170px);
    height: calc(var(--app-height) - 170px);
}

.powerbi-wrapper iframe {
    border: none !important;
}

.powerbi-wrapper-nofilter iframe {
    border: none !important;
}

.powerbi-container {
    height: calc(100vh - 180px);
    height: calc(var(--app-height) - 180px);
    max-height: calc(100vh - 180px);
    max-height: calc(var(--app-height) - 180px);
}

.button-style {
    font-size: 1.25em;
}


.MuiTableCell-root {
    padding: 5px 5px !important;
}

.MuiTableCell-body {
    font-size: 0.8125rem !important;
    padding: 4px 30px 4px 5px !important;
    letter-spacing: 0 !important;
}

.materialTblHeader {
    padding: 4px 30px 4px 5px !important;
    line-height: 1.2rem !important;
}

.mui-datepicker {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    width: 100%;
}

    .mui-datepicker > div > input {
        font-size: 13px;
        padding-bottom: 10.5px !important;
        padding-top: 10.5px !important;
        line-height: 19px !important;
    }

    .mui-datepicker div div button {
        padding-left: 10px;
    }

        .mui-datepicker div div button:hover {
            background-color: transparent !important;
        }

    .mui-datepicker > div {
        padding-left: 3px;
    }

.picker-clear {
    right: -15px;
}

    .picker-clear img {
        width: 18px;
        height: 18px;
    }

.dropzone .picker-clear {
    right: -12px;
}

.MuiOutlinedInput-root {
    min-height: 40px;
}

.grey .MuiFormControl-root {
    background-color: #333;
}

.grey .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline {
    border-color: #666 !important;
}

.mui-datepicker.grey > div > input {
    color: #fff;
}

.mui-datepicker.grey > div > div > button > span > svg {
    fill: #ccc !important;
}


.dark .MuiFormControl-root {
    background-color: #111 !important;
}

.dark .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline {
    border-color: #444 !important;
}

.mui-datepicker.dark > div > input {
    color: #fff;
}

.mui-datepicker.dark > div > div > button > span > svg {
    fill: #999 !important;
}


.textarea-input:not(.readonly):focus-within,
.text-field:not(.readonly):focus-within,
.mui-datepicker:not(.readonly):hover .MuiOutlinedInput-notchedOutline {
    border-color: #09c !important;
}

.mui-datepicker:not(.readonly):focus-within .MuiOutlinedInput-notchedOutline {
    border: 1px solid #09c !important;
}

.MuiOutlinedInput-root.Mui-error .MuiOutlinedInput-notchedOutline {
    border-color: #ddd !important;
}

.MuiOutlinedInput-root.Mui-error.Mui-focused .MuiOutlinedInput-notchedOutline {
    border-color: #09c !important;
}


.mui-datepickerdialog.grey > div.MuiPaper-root > div.MuiPickersBasePicker-container {
    background-color: #333;
}

    .mui-datepickerdialog.grey > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div > div > div > p {
        color: #fff;
    }

    .mui-datepickerdialog.grey > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div > div > .MuiPickersCalendarHeader-iconButton {
        transition: none;
        background-color: #333 !important;
        color: #fff;
    }

    .mui-datepickerdialog.grey > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div > div > button > span > img {
        filter: brightness(500%);
    }

    .mui-datepickerdialog.grey > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div > div.MuiPickersCalendarHeader-daysHeader span {
        color: #fff;
    }

    .mui-datepickerdialog.grey > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div.MuiPickersCalendar-transitionContainer > div > div > div > button > span > p {
        color: #fff;
    }

.mui-datepickerdialog.grey .MuiPickersYear-root {
    color: #fff
}

.mui-datepickerdialog.dark > div.MuiPaper-root > div.MuiPickersBasePicker-container {
    background-color: #222;
}

    .mui-datepickerdialog.dark > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div > div > div > p {
        color: #fff;
    }

    .mui-datepickerdialog.dark > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div > div > .MuiPickersCalendarHeader-iconButton {
        transition: none;
        background-color: #222 !important;
        color: #fff;
    }

    .mui-datepickerdialog.dark > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div > div > button > span > img {
        filter: brightness(500%);
    }

    .mui-datepickerdialog.dark > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div > div.MuiPickersCalendarHeader-daysHeader span {
        color: #fff;
    }

    .mui-datepickerdialog.dark > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div.MuiPickersCalendar-transitionContainer > div > div > div > button > span > p {
        color: #fff;
    }

.mui-datepickerdialog.default > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div.MuiPickersCalendar-transitionContainer > div > div > div > button.MuiPickersDay-daySelected {
    background-color: #09c;
}

.mui-datepickerdialog.dark .MuiPickersYear-root {
    color: #fff
}

.mui-datepickerdialog.blue > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div.MuiPickersCalendar-transitionContainer > div > div > div > button.MuiPickersDay-daySelected {
    background-color: #09c;
}

.mui-datepickerdialog.green > div.MuiPaper-root > div.MuiPickersBasePicker-container > div > div.MuiPickersCalendar-transitionContainer > div > div > div > button.MuiPickersDay-daySelected {
    background-color: #018748;
}

.mui-datepickerdialog.blue > div > div > div.MuiPickersToolbar-toolbar {
    background-color: #09c;
}

.mui-datepickerdialog.default > div > div > div.MuiPickersToolbar-toolbar {
    background-color: #09c;
}

.mui-datepickerdialog.green > div > div > div.MuiPickersToolbar-toolbar {
    background-color: #018748;
}

.mui-datepickerdialog.dark > div > div > div.MuiPickersToolbar-toolbar {
    background-color: #333;
}

.mui-datepickerdialog.grey > div > div > div.MuiPickersToolbar-toolbar {
    background-color: #444;
}

.mui-timepicker.dark > div > div > div {
    background-color: #333;
}

.mui-timepicker.dark > div > div .MuiPickersBasePicker-pickerView {
    background-color: #222;
}

    .mui-timepicker.dark > div > div .MuiPickersBasePicker-pickerView > div > div {
        background-color: #333;
    }

        .mui-timepicker.dark > div > div .MuiPickersBasePicker-pickerView > div > div span.MuiPickersClockNumber-clockNumber {
            color: #fff;
        }

.mui-timepicker.grey > div > div > div {
    background-color: #444;
}

.mui-timepicker.grey > div > div .MuiPickersBasePicker-pickerView {
    background-color: #333;
}

    .mui-timepicker.grey > div > div .MuiPickersBasePicker-pickerView > div > div {
        background-color: #444;
    }

        .mui-timepicker.grey > div > div .MuiPickersBasePicker-pickerView > div > div span.MuiPickersClockNumber-clockNumber {
            color: #fff;
        }

.mui-timepicker.blue > div > div > div.MuiPickersToolbar-toolbar {
    background-color: #09c;
}

.mui-timepicker.blue > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClock-pin {
    background-color: #09c;
}

.mui-timepicker.blue > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClockPointer-pointer {
    background-color: #09c;
}

    .mui-timepicker.blue > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClockPointer-pointer > div {
        background-color: #09c;
    }

.mui-timepicker.blue > div > div .MuiPickersBasePicker-pickerView > div > div span.MuiPickersClockNumber-clockNumberSelected {
    background-color: #09c;
}

.mui-timepicker.default > div > div > div.MuiPickersToolbar-toolbar {
    background-color: #09c;
}

.mui-timepicker.default > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClock-pin {
    background-color: #09c;
}

.mui-timepicker.default > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClockPointer-pointer {
    background-color: #09c;
}

    .mui-timepicker.default > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClockPointer-pointer > div {
        background-color: #09c;
    }

.mui-timepicker.default > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClock-pin {
    background-color: #09c;
}

.mui-timepicker.default > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClockPointer-pointer {
    background-color: #09c;
}

    .mui-timepicker.default > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClockPointer-pointer > div {
        background-color: #09c;
    }

.mui-timepicker.default > div > div .MuiPickersBasePicker-pickerView > div > div span.MuiPickersClockNumber-clockNumberSelected {
    background-color: #09c;
}


.mui-timepicker.green > div > div > div.MuiPickersToolbar-toolbar {
    background-color: #018748;
}

.mui-timepicker.green > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClock-pin {
    background-color: #018748;
}

.mui-timepicker.green > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClockPointer-pointer {
    background-color: #018748;
}

    .mui-timepicker.green > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClockPointer-pointer > div {
        background-color: #018748;
    }

.mui-timepicker.green > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClock-pin {
    background-color: #018748;
}

.mui-timepicker.green > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClockPointer-pointer {
    background-color: #018748;
}

    .mui-timepicker.green > div > div .MuiPickersBasePicker-pickerView > div > div div.MuiPickersClockPointer-pointer > div {
        background-color: #018748;
    }

.mui-timepicker.green > div > div .MuiPickersBasePicker-pickerView > div > div span.MuiPickersClockNumber-clockNumberSelected {
    background-color: #018748;
}

.rbc-date-cell a {
    color: black !important
}

.rbc-current a {
    color: white !important;
}

.full-calendar.dark > div > div.rbc-month-view > div.rbc-month-row > div.rbc-row-content > div > div a {
    color: white !important;
}

.full-calendar.dark .rbc-header,
.full-calendar.dark .rbc-header + .rbc-header,
.full-calendar.dark .rbc-rtl .rbc-header + .rbc-header,
.full-calendar.dark .rbc-month-view,
.full-calendar.dark .rbc-month-row + .rbc-month-row,
.full-calendar.dark .rbc-day-bg + .rbc-day-bg,
.full-calendar.dark .rbc-rtl .rbc-day-bg + .rbc-day-bg,
.full-calendar.dark .rbc-timeslot-group,
.full-calendar.dark .rbc-time-view-resources .rbc-time-gutter,
.full-calendar.dark .rbc-time-view-resources .rbc-time-header-gutter,
.full-calendar.dark .rbc-time-view,
.full-calendar.dark .rbc-time-view .rbc-allday-cell + .rbc-allday-cell,
.full-calendar.dark .rbc-time-header.rbc-overflowing,
.full-calendar.dark .rbc-rtl .rbc-time-header.rbc-overflowing,
.full-calendar.dark .rbc-time-header > .rbc-row:first-child,
.full-calendar.dark .rbc-time-header > .rbc-row.rbc-row-resource,
.full-calendar.dark .rbc-time-header-content,
.full-calendar.dark .rbc-rtl .rbc-time-header-content,
.full-calendar.dark .rbc-time-header-content > .rbc-row.rbc-row-resource
.full-calendar.dark .rbc-time-content,
.full-calendar.dark .rbc-time-content > * + * > *,
.full-calendar.dark .rbc-rtl .rbc-time-content > * + * > * {
    border-color: #444 !important;
}

.full-calendar.dark .rbc-time-content {
    border-top: 2px solid #444;
}

.full-calendar.grey .rbc-header,
.full-calendar.grey .rbc-header + .rbc-header,
.full-calendar.grey .rbc-rtl .rbc-header + .rbc-header,
.full-calendar.grey .rbc-month-view,
.full-calendar.grey .rbc-month-row + .rbc-month-row,
.full-calendar.grey .rbc-day-bg + .rbc-day-bg,
.full-calendar.grey .rbc-rtl .rbc-day-bg + .rbc-day-bg,
.full-calendar.grey .rbc-timeslot-group,
.full-calendar.grey .rbc-time-view-resources .rbc-time-gutter,
.full-calendar.grey .rbc-time-view-resources .rbc-time-header-gutter,
.full-calendar.grey .rbc-time-view,
.full-calendar.grey .rbc-time-view .rbc-allday-cell + .rbc-allday-cell,
.full-calendar.grey .rbc-time-header.rbc-overflowing,
.full-calendar.grey .rbc-rtl .rbc-time-header.rbc-overflowing,
.full-calendar.grey .rbc-time-header > .rbc-row:first-child,
.full-calendar.grey .rbc-time-header > .rbc-row.rbc-row-resource,
.full-calendar.grey .rbc-time-header-content,
.full-calendar.grey .rbc-rtl .rbc-time-header-content,
.full-calendar.grey .rbc-time-header-content > .rbc-row.rbc-row-resource
.full-calendar.grey .rbc-time-content,
.full-calendar.grey .rbc-time-content > * + * > *,
.full-calendar.grey .rbc-rtl .rbc-time-content > * + * > * {
    border-color: #666 !important;
}

.full-calendar.grey .rbc-time-content {
    border-top: 2px solid #666;
}

.full-calendar.grey > div > div.rbc-month-view > div.rbc-month-row > div.rbc-row-content > div > div a {
    color: white !important;
}

.rbc-month-row, .rbc-allday-cell, .rbc-events-container {
    cursor: pointer;
}

.graphHeader {
    width: 100%;
    height: 50px;
}

.graphText {
    float: left;
}

.graphTextTitle {
    margin-left: 15px;
    margin-top: 10px;
}

.graphTextDescription {
    float: left;
    margin-left: 15px;
}

.graphActions {
    float: right;
    padding-right: 15px;
    padding-top: 10px;
    border: 1px solid #d3d3d3;
    margin-right: 15px;
    margin-top: 10px;
    padding: 3px 0px;
    min-width: 24px;
    border-radius: 4px;
}

    .graphActions.dark,
    .graphActions.grey {
        border-color: #666;
    }

.graphStar {
    float: right;
    margin-right: 5px;
    margin-top: 10px;
    min-width: 24px;
}

.graphChangeType {
    float: left;
    margin: 10px 15px 4px 4px;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding-left: 4px;
}

    .graphChangeType.grey {
        border: 1px solid #666;
    }

    .graphChangeType.dark {
        border: 1px solid #444;
        background-color: #111;
    }

.graphChangeTypeLabel {
    float: left;
    margin-top: 10px;
}

.graphContainer {
    font-size: 90%;
}

    .graphContainer svg {
        background-color: transparent !important;
    }

    /* Time Series styling */
    .graphContainer .graphTimeSeries svg > g > g > rect {
        fill: transparent !important;
    }

    .graphContainer .graphTimeSeries svg > g > g > g > rect {
        fill: transparent !important;
    }

    .graphContainer .graphTimeSeries svg > g > g > g > g > rect {
        fill: transparent !important;
    }

    .graphContainer .graphTimeSeries svg > g > g:nth-last-child(2) > g > g > g > rect {
        fill: transparent !important;
    }


    /* css for the time series calendar popup */
    .graphContainer.dark .graphTimeSeries .fc-crs-widget {
        background-color: #111 !important;
    }

        .graphContainer.dark .graphTimeSeries .fc-crs-widget input {
            background-color: #111 !important;
            color: white !important;
        }

        .graphContainer.dark .graphTimeSeries .fc-crs-widget select {
            background-color: #111 !important;
            color: white !important;
        }

        .graphContainer.dark .graphTimeSeries .fc-crs-widget .fc-cal-header-container {
            background-color: #111 !important;
            color: white !important;
        }

        .graphContainer.dark .graphTimeSeries .fc-crs-widget .fc-cal-user-dateLI.fc-cal-user-normaldatedefault {
            background-color: #111 !important;
            color: white !important;
        }

        .graphContainer.dark .graphTimeSeries .fc-crs-widget .fc-cal-user-dateLI.fc-cal-user-disableddatedefault {
            background-color: #111 !important;
            color: #aaa !important;
        }

        .graphContainer.dark .graphTimeSeries .fc-crs-widget .fc-cal-sub-header li {
            background-color: #333 !important;
            color: white !important;
        }

    .graphContainer.dark .graphTimeSeries span.fusioncharts-container div:nth-child(5) div:nth-child(1) {
        background-color: #111 !important;
    }

    .graphContainer.dark .graphTimeSeries .fc-cal-date-selected {
        background-color: #09c !important;
    }

    .graphContainer.dark .graphTimeSeries svg > g > g g > text {
        fill: #999999 !important;
    }



    .graphContainer.grey .graphTimeSeries .fc-crs-widget {
        background-color: #111 !important;
    }

        .graphContainer.grey .graphTimeSeries .fc-crs-widget input {
            background-color: #111 !important;
            color: white !important;
        }

        .graphContainer.grey .graphTimeSeries .fc-crs-widget select {
            background-color: #111 !important;
            color: white !important;
        }

        .graphContainer.grey .graphTimeSeries .fc-crs-widget .fc-cal-header-container {
            background-color: #111 !important;
            color: white !important;
        }

        .graphContainer.grey .graphTimeSeries .fc-crs-widget .fc-cal-user-dateLI.fc-cal-user-normaldatedefault {
            background-color: #111 !important;
            color: white !important;
        }

        .graphContainer.grey .graphTimeSeries .fc-crs-widget .fc-cal-user-dateLI.fc-cal-user-disableddatedefault {
            background-color: #111 !important;
            color: #aaa !important;
        }

        .graphContainer.grey .graphTimeSeries .fc-crs-widget .fc-cal-sub-header li {
            background-color: #333 !important;
            color: white !important;
        }

    .graphContainer.grey .graphTimeSeries span.fusioncharts-container div:nth-child(5) div:nth-child(1) {
        background-color: #111 !important;
    }

    .graphContainer.grey .graphTimeSeries .fc-cal-date-selected {
        background-color: #09c !important;
    }

    .graphContainer.grey .graphTimeSeries svg > g > g g > text {
        fill: #ccc !important;
    }





.looker-iframe-class {
    width: 100%;
    height: calc(100vh - 170px);
    height: calc(var(--app-height) - 170px);
}
/* CSS specific to iOS devices */
@supports (-webkit-overflow-scrolling: touch) {

    .landing, .form-block, .tabs-menu, .menu-items-wrapper, .app-apps-wrapper, .notifications-wrapper, .frame-popup-content {
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
    }
}

.tab-link-details > span.icon-margin {
    margin-right: 5px;
}

.menu-img > span.icon-margin {
    margin-right: 5px;
}

.q-link > span.icon-margin {
    margin-right: 5px;
}

.noPadding {
    padding: 0 !important;
}

.rotate180 {
    transform: rotate(180deg);
}


.pie-legend-Wrapper {
    width: 100%;
    display: flex;
}

.pie-legend-Left {
    display: inline-block;
    width: 70%;
    padding: 0;
    margin: 0;
}

.pie-legend-Right {
    width: 30%;
    flex: 1;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    display: inline-flex;
}

.pie-legend-Right-content {
    max-height: 50vh;
    overflow: scroll;
    flex-direction: column;
    display: inline-flex;
    justify-content: stretch;
}

.pie-legend-Row {
    margin-bottom: 5px;
}

.pie-legend-Caption {
    font-size: x-large;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #FFF;
    width: 100px;
}

.pie-legend-Label {
    font-size: small;
    padding-left: 3px;
}

.pie-legend-Value {
    font-size: x-large;
    font-weight: bolder;
    padding-bottom: 0px;
    padding-left: 3px;
}

.mobileHeaderActionIcon {
    color: #666 !important;
    font-weight: normal;
}

    .mobileHeaderActionIcon * {
        display: inline-block;
    }


@media (max-width: 1279px) {
    .portalAppMenuOptions {
        display: none;        
    }  

    .tableHeightAdjust {
        max-height: unset !important;
    }

    .gridSelectActions {
        position: absolute;
    }

}

@media (max-width: 1250px) {
    .hero-box.news {
        max-width: 900px !important;
    }

    .MuiGridList-root.gridResponsive .mui-gridItem{
        width: 33.33% !important;
    }

    .blade-popup-content {
        max-width: 95vw;
    }  
    
}

@media (max-width: 1200px) {
    
    .col-lg-12 .text-field {
        min-width: 100%;
    }

    .col-lg-3 .text-field {
        --min-width: 200px;
    }

  .blade-popup.popup-xs .textarea-input, 
  .blade-popup.popup-sm .textarea-input, 
  .blade-popup.popup-md .textarea-input, 
  .blade-popup.popup-lg .textarea-input,
  .blade-popup.popup-full .textarea-input {
    min-width: 100%;    
  }

  .blade-popup.popup-lg .form-pdf embed {
    min-width: calc(100vw - 300px);    
  }

  .blade-popup.popup .form-pdf embed {
    min-width: 1000px;    
  }  
    
    .col-lg-6 .text-field {
        --min-width: 250px;
    }

    .col-lg-4 .text-field {
        --min-width: 250px;
    }

    .col-lg-3 .text-field {
        --min-width: 200px;
    }

    .blade-popup .col-lg-12 .textarea-input {
        min-width: 50vw;
    }

    .blade-popup.popup-xs .textarea-input,
    .blade-popup.popup-sm .textarea-input,
    .blade-popup.popup-md .textarea-input,
    .blade-popup.popup-lg .textarea-input {
        min-width: 100%;
    }

    .blade-popup.popup-lg .blade-popup-content {
        max-width: 90%;
    }

    .blade-popup.popup-lg .form-pdf embed {
        min-width: calc(100vw - 200px);    
    }

    .blade-popup.popup .form-pdf embed {
        min-width: calc(100vw - 300px);    
    }    

    .bladeFormDivButton {
        max-width: 50% !important;
    }   
}
  
@media (max-width: 1150px) {
    .menu-docked .choice-spacer {
        width: 50%;
    }
    
}

@media (max-width: 1023px) {

  .blade-popup.popup-xs .textarea-input, 
  .blade-popup.popup-sm .textarea-input, 
  .blade-popup.popup-md .textarea-input, 
  .blade-popup.popup-lg .textarea-input {
    min-width: 100%;    
  }
  
  .blade-popup.popup-lg .form-pdf embed {
    min-width: calc(100vw - 200px);    
  }

  .blade-popup.popup .form-pdf embed {
    min-width: calc(100vw - 500px);    
  }

    .blade-header.pop .q-links:not(.mobile):not(.pdlV1), 
    .blade-item-action-bar .q-links:not(.mobile):not(.pdlV1) {
        display: none;
    }

    .blade-header.pop .q-links.mobile,
    .blade-item-action-bar .q-links.mobile {
        display: flex;
    }

    .blade-header.pop .q-links .q-link.dark svg,
    .blade-header.pop .q-links .q-link.grey svg,
    .blade-item-action-bar .q-links .q-link.dark svg,
    .blade-item-action-bar .q-links .q-link.grey svg {
        fill: #fff;
    }

    .blade-header.pop .mobile .q-link > div,
    .blade-item-action-bar .mobile .q-link > div {
        margin: 0px !important;
    }

    .blade-header.pop .mobile .q-link,
    .blade-item-action-bar .mobile .q-link{
        padding: 9px 12px 10px 12px;
    }

}

@media (max-width: 1000px) {
    .choice-spacer {
        width: 50%;
    }
    .menu-docked-collapsed .choice-spacer {
        width: 50%;
    }

}

@media (max-width: 991px) {
    /* .menu {
        overflow: hidden;
        width: 0%;
    } */

    .app-panel-contents {
        width: calc(100vw - 225px);
    }

        .app-panel-contents.collapsed {
            width: calc(100vw - 75px);
        }

    .choice {
        padding-bottom: 15px;
    }

    .dash-page-title {
        height: 60px;
        line-height: 1.1em;
    }

        .dash-page-title.news {
            padding-left: 25px;
        }

    .dash-page-title-text.news {
        padding-left: 25px;
    }

    .box-title {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

        .box-title.news {
            padding-left: 25px;
        }

    .news-action {
        padding-left: 25px;
    }

    .featured-new-box.news {
        min-height: 0px;
        padding-top: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    .all-app-panel {
        position: fixed;
        left: 0px;
        top: 0px;
        bottom: 0px;
        width: 100%;
    }

    .MuiGridList-root.gridResponsive .mui-gridItem {
        width: 50% !important;
    }

}

@media (max-width: 850px) {
    .menu-docked .choice-spacer {
        width: 100%;
        max-width: 700px;
        min-height: unset;
    }

    .menu-docked .choice {
        min-height: unset;
    }
}

@media (max-width: 767px) {

    .q-link.usr {
        min-width: unset;
    }

    .desktopOnly {
        display: none !important;
    }

    .mobileOnly {
        display: block !important;
    }

    .mui-paper .mobileOnly {
        display: flex !important;
    }
        
    .news-slider {
        width: calc(100vw - 50px);
        height: 200px;
        min-width: 280px;
    }

    .news-action a {
        width: 150px;
        height: 35px;
        font-size: 13px;
    }

    .panel .panel-content {
        min-width: 370px;
    }
    
    .blade-popup:not(.popup-xs):not(.transparent) .blade-popup-content {
        max-width: calc(100vw - 20px);
        min-width: calc(100vw - 20px);
    }

    .blade-popup .blade-item.pop {
        padding: 5px !important;
    }

    .blade-popup .blade-header,
    .blade-popup .modal-footer {
        min-height: 45px;
    }

    .blade-popup .modal-footer {
        margin-top: 15px;
        padding: 0px 10px;
    }
    
    .popup-blade:not(.loading) .blade-header.pop,
    .popup-app:not(.loading) .blade-header.pop {
        margin-top: 0px;
    }

    .blade-popup .blade-header .blade-q-links {
        margin: 5px 5px;
    }

    .popup-blade .blade-header .blade-q-links,
    .popup-app .blade-header .blade-q-links {
        margin: 8px 4px;
    }

    .blade-header .header-title {
        font-size: 17px;
    }

    /* applies to v1 only */
    .legacy-popup:not(.transparent) .blade-header-title {
        margin: 0px 0px 0px 0px;
    }
    
    /* applie to v1 only */
    .legacy-popup .blade-header-title .header-title {
        padding-left: 5px;
    }

    .blade-item-action-bar .blade-header-title,
    .blade-popup .blade-header .header-title,
    .slideOutForm .panel-content .slideOutTitle {
        font-size: 20px;
    }

    .blade-popup .blade-header .blade-header-title {
        padding-left: 0px;
    }

    .panel-content .requiredLabel,
    .blade-popup .requiredLabel {
        left: 10px;
        top: -20px;
        bottom: unset;
    }

    .blade-popup .requiredLabel {
        left: 15px;
    }

    .close {
        max-width: 50px;
    }

    .landing {
        max-width: 100%;
    }

    .choice {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        opacity: 1;
    }

    .q-link {
        min-width: 40px;
    }

        .q-link.msg {
            min-width: 40px;
        }

        .q-link.usr {
            padding-left: 5px;
        }

    .box-title {
        padding-left: 10px;
    }

    .hero-box {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .featured-new-box {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-align-self: stretch;
        -ms-flex-item-align: stretch;
        -ms-grid-row-align: stretch;
        align-self: stretch;
    }

        .featured-new-box.news {
            min-height: 0px;
        }

    .pinnedGraphs {
        width: 100%;
        display: block;
    }

    .menu-docked-collapsed .pinnedGraphs .bladeComponentWrapper {
        max-width: calc(100vw - 100px);
    }

    .panel-empty-block {
        padding-top: 20px;
    }

    .notification-img {
        width: 50px;
        height: 50px;
    }

    .panel-empty-block .empty-title{
        margin-top: 15px;  
    }

    #BladeWrapper.hasMenu {
        padding-left: 20px;
    }

    .BladeSectionWrapper.hasMenu {
        padding-left: 20px;
    }

    .BladeSectionWrapper, #BladeWrapper {
        padding-left: 10px !important;    
    }

    .BladeSectionWrapper .formColumnWrapper {
        padding-right: 0px !important;    
    }
    
    .blade-body {
        height: calc(100vh - 130px);
        height: calc(var(--app-height) - 130px);
    }

    .popup-blade:not(.loading) {
        left: 20px !important; 
    }

    .invisible-tab-menu-closer {
        display: block;
        background-color: rgba(0, 0, 0, 0.3);
        position: absolute;
        z-index: 6;
        width: 100vw;
        height: 100vh;
        height: var(--app-height);
        top: 40px;
        left: 0px;
    }

    .popup-blade ~ .dashboard .blade .blade-content .env-select, 
    .popup-blade ~ .dashboard .blade .blade-content .tabs-menu, 
    .popup-blade ~ .dashboard .blade .blade-content .tab-menu-closer {
        z-index: 13;
    }

    .popup-blade ~ .dashboard .blade .blade-content .invisible-tab-menu-closer {
        z-index: 12;
    }

    .blade-popup:not(.popup-blade) ~ .dashboard .blade .blade-content .env-select, 
    .blade-popup:not(.popup-blade) ~ .dashboard .blade .blade-content .tabs-menu, 
    .blade-popup:not(.popup-blade) ~ .dashboard .blade .blade-content .tab-menu-closer {
        z-index: 7;
    }
    
    .blade-popup:not(.popup-blade)  ~ .dashboard .blade .blade-content .invisible-tab-menu-closer {
        z-index: 6;
    }

    .blade-popup:not(.popup-blade):not(.popup-app) ~ .header {
        z-index: 11;
    }

    .blade-item-action-bar .searchTag.open {
        position: absolute;
        z-index: 1;
        left: 20px;
        width: calc(100% - 45px);
        background-color: #FFF;
        max-width: 100%;
    }

    .blade-item-action-bar .searchTag.open ~ div,
    .blade-item-action-bar .searchTag.open ~ a {
        display: none;
    }

    .blade-item-action-bar .searchTag.open.grey {
        background-color: #444 !important;
    }

    .blade-item-action-bar .searchTag.open.dark {
        background-color: #000 !important;
    }

    .blade-item-action-bar {
        padding-top: 0px;
        margin-bottom: 0px;
    }

    .blade-header .q-link {
        min-width: 35px;
    }

    .blade-item-action-bar .q-link {
        padding: 7px;
        margin: 0 2px 0 2px;
    }
    
    .right-action {
        padding-right: 5px;
    }

    .searchTag {
        margin-right: 5px;
        padding-right: 5px;
        padding-left: 5px;
    }
    
    .blade-item-action-bar .searchTag img {
        margin-right: 0px;
    }

    .blade-item-action-bar .searchTag.open {
        width: calc(100% - 28px);
    }

    .bladeComponentWrapper .filterTag {
        margin-bottom: 2px;
    }

    th.MuiTableCell-root,
    td.MuiTableCell-root {
        padding-right: 5px !important;
    }

    th.MuiTableCell-root.with-help-context  {
        padding-right: 20px !important;
    }


    .tab-link-pop {
        padding-right: 0px;
    }

    .form-sub-title {
        margin-top: 5px;  
    }

    .header_type_actions span{
        display: none;
    }
   
}

@media (max-width: 720px) {
    .MuiGridList-root.gridResponsive .mui-gridItem {
        width: 100% !important;
    }
    
    .all-apps-item {
        padding: 7px 20px 7px 10px;
        width: 100%;
    }


}  

@media screen and (max-width: 600px), 
       screen and (max-height: 600px) {

    #kubra-help-popup {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        height: calc(100vh - 20px) !important;
        height: calc(var(--app-height) - 20px) !important;
        max-height: calc(100vh - 20px) !important;
        max-height: calc(var(--app-height) - 20px) !important;
        top: 10px !important;
        left: 10px !important;
    }

    
    .DayPickerInput-Overlay {
        width: 100vw !important;
        height: calc(100vh - 40px) !important;
        height: calc(var(--app-height) - 40px) !important;
        top: 40px !important;
    }

    .DayPicker-Months {
        height: calc(100vh - 121px) !important;
        height: calc(var(--app-height) - 121px) !important;
        width: calc(100vw - 90px) !important;
        max-height: 550px !important;
        justify-content: center !important;
        overflow-y: scroll;
        align-items: center;
    }

    .DayPicker-Months-Div {
        height: calc(100vh - 121px) !important;
        height: calc(var(--app-height) - 121px) !important;  
    }

    .DayPicker-Preset-Div {
        position: absolute !important;
        height: calc(100vh - 121px) !important;
        height: calc(var(--app-height) - 121px) !important;
        float: right;
        width: 100px !important;
        top: 0px !important;
        right: 0px !important;
    }

    .DayPicker-Buttons-Div {
        height: 80px !important;
        position: absolute !important;
        bottom: 0px !important;
    }

    .bladeComponent {
        max-height: unset !important;
    }

    /* popup srhinking  */
    .blade-popup-content .blade-header {
        position: sticky;
        top: 0;  
        margin-top: 0px !important;
        z-index: 10;
    }

    .popup-blade:not(.loading) .blade-header.pop,
    .popup-app:not(.loading) .blade-header.pop,
    .popup-full:not(.loading) .blade-header.pop {
        padding-top: 0px;
    }

    .button.foot {
        height: 34px;
        max-width: 120px;
        min-width: 85px;
        margin-top: 0px;
        margin-bottom: 5px;
        margin-left: 5px;
        padding-right: 10px;
        padding-left: 10px;
        font-size: 12px;
        font-weight: 500;
        line-height: 14px;
    }

    .blade-popup-content {
        overflow-y: auto;
    }

    .modal-footer {
        position: relative;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-end;
        padding: 0px 10px 10px 0px;
    }

    .popup .modal-footer{
        margin-bottom: 10px;
    }

    .popup-app .modal-footer, 
    .popup-blade .modal-footer, 
    .popup-full .modal-footer,
    .panel-content .modal-footer{
        min-height: initial !important;
    }

    .blade-item.pop {
        height: unset;
        overflow: unset;
    }

    .blade-item {
        max-height: unset;
    }

    .form-block {
        overflow-y: unset;
    }

    .blade-popup .textarea-input {
        min-height: 300px;
        max-height: calc(100vh - 300px);
        max-height: calc(var(--app-height) - 300px);
    }

    .blade-popup-content .blade-header .close-side-panel {
        height: 35px;
    }


    /* panel scrolling*/
    .slideOutForm .panel-content {
        overflow-y: auto !important;
        padding-left: 5px;
        padding-right: 5px;
    }

    .slideOutForm .panel-content .panel-nav .blade-q-links {
        right: 0px;
    }

    .slideOutForm .panel-content .panel-nav {
        position: sticky !important;
        padding-top: 0px;
        top: 0px;
    }

    .slideOutForm .panel-content .modal-content {
        height: unset !important;
    }
}
.materialTblHeader {
    vertical-align: top !important;
    white-space: break-spaces;
}

@media screen and (max-width: 320px) {
    #kubra-help-popup {
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100vh !important;
        height: var(--app-height) !important;
        max-height: 100vh !important;
        max-height: var(--app-height) !important;
        top: 0px !important;
        left: 0px !important;
    }

    .DayPicker-Month {
        margin: 2px !important;
    }

    .DayPicker-Day {
        padding: 0px !important;
        margin: 0px !important;
    }

}

@media (max-width: 680px) {
    .menu-docked-collapsed .cards {
        display: block;
        width: 100%;
    }

    .menu-docked-collapsed .choice-spacer {
        max-width: 1000px;
        min-height: unset;
        width: calc(100vw - 70px);
    }

    .menu-docked-collapsed .choice {
        min-height: unset;
    }
    

}

@media (max-width: 630px) {

    .choice-spacer {
        min-height: unset;
        width: calc(100vw - 20px);
        max-width: unset;
    }
}

@media (max-width: 600px) {

    .blade-popup.popup-sm .blade-popup-content {
        max-width: 80vw;
        min-width: 300px;
    }

    .kubra-title .title-text {
        display: none;
    }

    .kubra-title .title-logo img {
        min-width: 25px;
        display: inline-block;
    }

    .header .kubra-client-nav {
        margin-left: 18px;
    }    

        .header .kubra-client-nav .user-client {
            font-size: 14px;
        }

    .quick-access .q-link {
        min-width: 35px;
    }

    .quick-access .q-link .panel-trigger {
        padding-right: 1px;
        padding-left: 1px;
    }

    .all-app-panel .app-panel-contents {
        margin-left: 50px;
        width: calc(100vw - 60px);
        max-width: 400px;
    }

    .dash-page-title-text {
        display: none !important;
    }

    .w-placeholder-content{
        max-width: calc(100vw - 150px);    
    }

    .filterTag.dynamicFilter .w-placeholder-content,
    .filterTag.dynamicFilter .companyDropdown input{
        max-width: calc(100vw - 170px);    
    }

    .MuiTablePagination-toolbar {
        flex-direction: column;
    }

    .MuiTablePagination-toolbar .tableActionsStyle{
        left: unset !important;
    }
    
}

@media (max-width: 500px) {

    .blade-popup-content {
        max-width: 100vw !important;
        min-width: 300px;
    }

    .text-field {
        min-width: 100%;
    }

    .blade-popup.popup .form-pdf embed {
        min-width: calc(100vw - 100px);    
    }

    .allAppsSearch {
        min-width: initial !important;
        width: calc(100vw - 230px);
    }

    .blade-item-action-bar .blade-header-title {
        margin-right: 5px;
    }
   
    .materialTblHeader:not(.with-sort-icon):not(.with-help-context):not(.checkable) svg {
        display: none;
    }

    .tag.icon-tag ~ div {
        display: none !important;
    }
}

@media (max-width: 479px) {

    .choice {
        min-height: unset;
    }

    .menu-docked-collapsed .choice-spacer {
        width: calc(100vw - 70px);
    }

    .pinnedGraphs .bladeComponentWrapper {
        max-width: calc(100vw - 50px);
    }

    .pinnedGraphs .bladeComponentWrapper {
        min-width: 270px;
    }

    .close-side-panel {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

        .close-side-panel.red:hover img {
            filter: brightness(500%);
        }

    .blade-content .blade-header {
        min-width: calc(100vw - 50px);
    }

    .blade-content .blade-header .blade-q-links .q-link div {
        display: none;
    }

    .app-select {
        left: auto;
        top: 40px;
        right: auto;
        width: 100%;
    }

        .q-link.msg {
            -webkit-box-align: stretch;
            -webkit-align-items: stretch;
            -ms-flex-align: stretch;
            align-items: stretch;
        }

    .mob-user {
        display: none;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .back-img {
        width: 24px;
    }

    .mob-qlinks {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 50px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

        .mob-qlinks:hover {
            background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2)));
            background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
        }

    .blade-item {
        position: static;
        width: 100%;
        max-width: 100%;
        padding-left: 0px;
    }

    /**Table overwrite*/
    .blade-item table thead th {
        color: #666 !important;
        font-weight: bold !important;
        border-bottom: solid 2px #ccc;
        font-size: 13px;
    }

    .blade-item table tbody tr td {
        white-space: nowrap;
        /*overflow: hidden;
        text-overflow: ellipsis;
        max-width: 120px;*/
    }

    .blade-popup-content > .blade-item > .blade-body {
        margin: 0;
        padding: 0;
    }

    .text-field.date {
        width: 100%;
    }

        .grid-block.mob {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            font-size: 0.85em;
        }

    .grid-col {
        padding-left: 0px;
    }

        .grid-col.mob {
            min-width: 25%;
        }


    .blade-subtitle {
        display: none;
    }

    .dash-header {
        height: 50px;
        font-size: 1.15em;
    }

    .box-title.news {
        padding-left: 15px;
    }

    .news-action {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        padding-left: 25px;
    }

    .featured-new-box.news {
        min-height: 250px;
        padding-top: 0px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }
    .all-apps-item {
        width: 100%;
        margin-right: 0px;
    }

    .all-app-panel .app-panel-contents {
        margin-left: 20px;
        width: calc(100vw - 40px);
        max-width: 100vw;
    }
    
    .blade-header .header-title {
        width: calc(100vw - 180px);
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .blade-header .header-title.titleHasPreview {
        width: calc(100vw - 145px);
        min-width: 170px;
    }

    #settings .MuiIconButton-root.muiradio  {
        padding: 3px !important;
    }
}
@media (max-width: 410px) {

    .header .kubra-client-nav .user-client {
        max-width: 80px;
    }

    .quick-access .q-link {
        width: 25px;
        padding: 1px;
    }

    .panel .panel-content {
        min-width: 100vw;
        width: 100%;
    }

    .dash-page-title.news {
        margin-top: 50px;
        font-size: 20px;
        padding-left: 0px;
        height: unset;
        text-align: left;
        width: calc(100vw - 130px);
    }

    .news-action {
        position: absolute;
        left: 25px;
        bottom: 20px;
    }

    .news-action a {
        margin-top: 5px
    }

    .box-title.news {
        position: absolute;
        top: 0px;
        left: 0px;
    }

    .news-slider {
        height: 275px;
        min-height: 275px;
    }

    .featured-new-box.news {
        height: 275px;
        min-height: 275px;
    }

    .w-slider-arrow-left, .w-slider-arrow-right {
        top: 50px;
        width: 50px;
    }

    .w-icon-slider-left, .w-icon-slider-right {
        top: 20px;
        bottom: 70px;
        right: 0px;
        left: 0px;
    }

}


@media (max-width: 400px) {
    .flex-grid {
        display: block;
    }

    .theme-select-option {
        width: 45px;
        height: 45px;
        min-height: 45px;
        min-width: 45px;
    }    
    
    .all-app-panel .app-panel-contents {
        margin-left: 0px;
        width: 100vw;
        max-width: 100vw;
    }


    .allAppsSearch {
        width: calc(100vw - 180px);
    }
}

@media (max-width: 319px) {
    .reactApp {
        overflow-x: auto;
    }
    
    .panel .panel-content  {
        min-width: 320px !important;
    }
}

@media (max-height: 410px) {
    
    .menu-list {
        height: calc(100vh - 70px);
        height: calc(var(--app-height) - 70px);
    }

    .menu-collapse {
        height: 30px;
    }

    .menu-collapse div {
        margin-top: 5px;
        margin-left: -19px;
    }

    .tabs-menu {
        height: calc(100vh - 110px);
        height: calc(var(--app-height) - 110px);
    }

    .env-select + .tabs-menu {
        height: calc(100vh - 150px);
        height: calc(var(--app-height) - 150px);
    }

    .tab-menu-closer {
        height: 30px;
    }

    .overview-container {
        flex-direction: row;
    }

    .choice-icon.lg {
        margin-right: 15px;
        width: 60px;
        height: 60px;
    }

    .choice-icon.lg img {
        width: 30px !important;
        height: 30px !important;
    }

    .overview-summary {
        margin-top: 20px;
    }

    .overview-title {
        padding: 10px 0px;
        font-size: 30px;
    }

}


.fontA {
    font: Roboto;
    font-size: 14px;
    color: #242424;
    font-weight: 700;
}

.fontA.grey,
.fontA.dark {
    color: #FFFFFF;
}

.fontB {
    font: Roboto;
    font-size: 13px;
    color: #242424;
    font-weight: 400;
}

.fontB.grey,
.fontB.dark {
    color: #CBD0D4;
}
/* DayPicker styles */

.DayPicker {
  display: inline-block;
  font-size: 1rem;
}

.DayPicker-wrapper {
  position: relative;

  flex-direction: row;
  padding-bottom: 1em;

  -webkit-user-select: none;

     -moz-user-select: none;

      -ms-user-select: none;

          user-select: none;
}

.DayPicker-Months {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.DayPicker-Month {
  display: table;
  margin: 0 1em;
  margin-top: 1em;
  border-spacing: 0;
  border-collapse: collapse;

  -webkit-user-select: none;

     -moz-user-select: none;

      -ms-user-select: none;

          user-select: none;
}

.DayPicker-NavBar {
}

.DayPicker-NavButton {
  position: absolute;
  top: 1em;
  right: 1.5em;
  left: auto;

  display: inline-block;
  margin-top: 2px;
  width: 1.25em;
  height: 1.25em;
  background-position: center;
  background-size: 50%;
  background-repeat: no-repeat;
  color: #8B9898;
  cursor: pointer;
}

.DayPicker-NavButton:hover {
  opacity: 0.8;
}

.DayPicker-NavButton--prev {
  margin-right: 1.5em;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAwCAYAAAB5R9gVAAAABGdBTUEAALGPC/xhBQAAAVVJREFUWAnN2G0KgjAYwPHpGfRkaZeqvgQaK+hY3SUHrk1YzNLay/OiEFp92I+/Mp2F2Mh2lLISWnflFjzH263RQjzMZ19wgs73ez0o1WmtW+dgA01VxrE3p6l2GLsnBy1VYQOtVSEH/atCCgqpQgKKqYIOiq2CBkqtggLKqQIKgqgCBjpJ2Y5CdJ+zrT9A7HHSTA1dxUdHgzCqJIEwq0SDsKsEg6iqBIEoq/wEcVRZBXFV+QJxV5mBtlDFB5VjYTaGZ2sf4R9PM7U9ZU+lLuaetPP/5Die3ToO1+u+MKtHs06qODB2zBnI/jBd4MPQm1VkY79Tb18gB+C62FdBFsZR6yeIo1YQiLJWMIiqVjQIu1YSCLNWFgijVjYIuhYYCKoWKAiiFgoopxYaKLUWOii2FgkophYp6F3r42W5A9s9OcgNvva8xQaysKXlFytoqdYmQH6tF3toSUo0INq9AAAAAElFTkSuQmCC');
}

.DayPicker-NavButton--next {
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAwCAYAAAB5R9gVAAAABGdBTUEAALGPC/xhBQAAAXRJREFUWAnN119ugjAcwPHWzJ1gnmxzB/BBE0n24m4xfNkTaOL7wOtsl3AXMMb+Vjaa1BG00N8fSEibPpAP3xAKKs2yjzTPH9RAjhEo9WzPr/Vm8zgE0+gXATAxxuxtqeJ9t5tIwv5AtQAApsfT6TPdbp+kUBcgVwvO51KqVhMkXKsVJFXrOkigVhCIs1Y4iKlWZxB1rX4gwlpRIIpa8SDkWmggrFq4IIRaJKCYWnSgnrXIQV1r8YD+1Vrn+bReagysIFfLABRt31v8oBu1xEBttfRbltmfjgEcWh9snUS2kNdBK6WN1vrOWxObWsz+fjxevsxmB1GQDfINWiev83nhaoiB/CoOU438oPrhXS0WpQ9xc1ZQWxWHqUYe0I0qrKCQKjygDlXIQV2r0IF6ViEBxVTBBSFUQQNhVYkHIVeJAtkNsbQ7c1LtzP6FsObhb2rCKv7NBIGoq4SDmKoEgTirXAcJVGkFSVVpgoSrXICGUMUH/QBZNSUy5XWUhwAAAABJRU5ErkJggg==');
}

.DayPicker-NavButton--interactionDisabled {
  display: none;
}

.DayPicker-Caption {
  display: table-caption;
  margin-bottom: 0.5em;
  padding: 0 0.5em;
  text-align: left;
}

.DayPicker-Caption > div {
  font-weight: 500;
  font-size: 1.15em;
}

.DayPicker-Weekdays {
  display: table-header-group;
  margin-top: 1em;
}

.DayPicker-WeekdaysRow {
  display: table-row;
}

.DayPicker-Weekday {
  display: table-cell;
  padding: 0.5em;
  color: #8B9898;
  text-align: center;
  font-size: 0.875em;
}

.DayPicker-Weekday abbr[title] {
  border-bottom: none;
  text-decoration: none;
}

.DayPicker-Body {
  display: table-row-group;
}

.DayPicker-Week {
  display: table-row;
}

.DayPicker-Day {
  display: table-cell;
  padding: 0.5em;
  border-radius: 50%;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
}

.DayPicker-WeekNumber {
  display: table-cell;
  padding: 0.5em;
  min-width: 1em;
  border-right: 1px solid #EAECEC;
  color: #8B9898;
  vertical-align: middle;
  text-align: right;
  font-size: 0.75em;
  cursor: pointer;
}

.DayPicker--interactionDisabled .DayPicker-Day {
  cursor: default;
}

.DayPicker-Footer {
  padding-top: 0.5em;
}

.DayPicker-TodayButton {
  border: none;
  background-color: transparent;
  background-image: none;
  box-shadow: none;
  color: #4A90E2;
  font-size: 0.875em;
  cursor: pointer;
}

/* Default modifiers */

.DayPicker-Day--today {
  color: #D0021B;
  font-weight: 700;
}

.DayPicker-Day--outside {
  color: #8B9898;
  cursor: default;
}

.DayPicker-Day--disabled {
  color: #DCE0E0;
  cursor: default;
  /* background-color: #eff1f1; */
}

/* Example modifiers */

.DayPicker-Day--sunday {
  background-color: #F7F8F8;
}

.DayPicker-Day--sunday:not(.DayPicker-Day--today) {
  color: #DCE0E0;
}

.DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside) {
  position: relative;

  background-color: #4A90E2;
  color: #F0F8FF;
}

.DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside):hover {
  background-color: #51A0FA;
}

.DayPicker:not(.DayPicker--interactionDisabled)
  .DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--selected):not(.DayPicker-Day--outside):hover {
  background-color: #F0F8FF;
}

/* DayPickerInput */

.DayPickerInput {
  display: inline-block;
}

.DayPickerInput-OverlayWrapper {
  position: relative;
}

.DayPickerInput-Overlay {
  position: absolute;
  left: 0;
  z-index: 1;

  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

.container,.container-fluid{margin-right:auto;margin-left:auto}.container-fluid{padding-right:2rem;padding-left:2rem}.row{box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:0;-ms-flex:0 1 auto;flex:0 1 auto;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-right:-.5rem;margin-left:-.5rem}.row.reverse{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.col.reverse{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.col-xs,.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-offset-0,.col-xs-offset-1,.col-xs-offset-10,.col-xs-offset-11,.col-xs-offset-12,.col-xs-offset-2,.col-xs-offset-3,.col-xs-offset-4,.col-xs-offset-5,.col-xs-offset-6,.col-xs-offset-7,.col-xs-offset-8,.col-xs-offset-9{box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:.5rem;padding-left:.5rem}.col-xs{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:0;flex-basis:0;max-width:100%}.col-xs-1{-ms-flex-preferred-size:8.33333333%;flex-basis:8.33333333%;max-width:8.33333333%}.col-xs-2{-ms-flex-preferred-size:16.66666667%;flex-basis:16.66666667%;max-width:16.66666667%}.col-xs-3{-ms-flex-preferred-size:25%;flex-basis:25%;max-width:25%}.col-xs-4{-ms-flex-preferred-size:33.33333333%;flex-basis:33.33333333%;max-width:33.33333333%}.col-xs-5{-ms-flex-preferred-size:41.66666667%;flex-basis:41.66666667%;max-width:41.66666667%}.col-xs-6{-ms-flex-preferred-size:50%;flex-basis:50%;max-width:50%}.col-xs-7{-ms-flex-preferred-size:58.33333333%;flex-basis:58.33333333%;max-width:58.33333333%}.col-xs-8{-ms-flex-preferred-size:66.66666667%;flex-basis:66.66666667%;max-width:66.66666667%}.col-xs-9{-ms-flex-preferred-size:75%;flex-basis:75%;max-width:75%}.col-xs-10{-ms-flex-preferred-size:83.33333333%;flex-basis:83.33333333%;max-width:83.33333333%}.col-xs-11{-ms-flex-preferred-size:91.66666667%;flex-basis:91.66666667%;max-width:91.66666667%}.col-xs-12{-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.col-xs-offset-0{margin-left:0}.col-xs-offset-1{margin-left:8.33333333%}.col-xs-offset-2{margin-left:16.66666667%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-4{margin-left:33.33333333%}.col-xs-offset-5{margin-left:41.66666667%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-7{margin-left:58.33333333%}.col-xs-offset-8{margin-left:66.66666667%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-10{margin-left:83.33333333%}.col-xs-offset-11{margin-left:91.66666667%}.start-xs{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;text-align:start}.center-xs{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;text-align:center}.end-xs{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;text-align:end}.top-xs{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.middle-xs{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bottom-xs{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.around-xs{-ms-flex-pack:distribute;justify-content:space-around}.between-xs{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.first-xs{-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1}.last-xs{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}@media only screen and (min-width:48em){.container{width:49rem}.col-sm,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-offset-0,.col-sm-offset-1,.col-sm-offset-10,.col-sm-offset-11,.col-sm-offset-12,.col-sm-offset-2,.col-sm-offset-3,.col-sm-offset-4,.col-sm-offset-5,.col-sm-offset-6,.col-sm-offset-7,.col-sm-offset-8,.col-sm-offset-9{box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:.5rem;padding-left:.5rem}.col-sm{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:0;flex-basis:0;max-width:100%}.col-sm-1{-ms-flex-preferred-size:8.33333333%;flex-basis:8.33333333%;max-width:8.33333333%}.col-sm-2{-ms-flex-preferred-size:16.66666667%;flex-basis:16.66666667%;max-width:16.66666667%}.col-sm-3{-ms-flex-preferred-size:25%;flex-basis:25%;max-width:25%}.col-sm-4{-ms-flex-preferred-size:33.33333333%;flex-basis:33.33333333%;max-width:33.33333333%}.col-sm-5{-ms-flex-preferred-size:41.66666667%;flex-basis:41.66666667%;max-width:41.66666667%}.col-sm-6{-ms-flex-preferred-size:50%;flex-basis:50%;max-width:50%}.col-sm-7{-ms-flex-preferred-size:58.33333333%;flex-basis:58.33333333%;max-width:58.33333333%}.col-sm-8{-ms-flex-preferred-size:66.66666667%;flex-basis:66.66666667%;max-width:66.66666667%}.col-sm-9{-ms-flex-preferred-size:75%;flex-basis:75%;max-width:75%}.col-sm-10{-ms-flex-preferred-size:83.33333333%;flex-basis:83.33333333%;max-width:83.33333333%}.col-sm-11{-ms-flex-preferred-size:91.66666667%;flex-basis:91.66666667%;max-width:91.66666667%}.col-sm-12{-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.col-sm-offset-0{margin-left:0}.col-sm-offset-1{margin-left:8.33333333%}.col-sm-offset-2{margin-left:16.66666667%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-4{margin-left:33.33333333%}.col-sm-offset-5{margin-left:41.66666667%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-7{margin-left:58.33333333%}.col-sm-offset-8{margin-left:66.66666667%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-10{margin-left:83.33333333%}.col-sm-offset-11{margin-left:91.66666667%}.start-sm{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;text-align:start}.center-sm{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;text-align:center}.end-sm{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;text-align:end}.top-sm{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.middle-sm{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bottom-sm{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.around-sm{-ms-flex-pack:distribute;justify-content:space-around}.between-sm{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.first-sm{-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1}.last-sm{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}}@media only screen and (min-width:64em){.container{width:65rem}.col-md,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-offset-0,.col-md-offset-1,.col-md-offset-10,.col-md-offset-11,.col-md-offset-12,.col-md-offset-2,.col-md-offset-3,.col-md-offset-4,.col-md-offset-5,.col-md-offset-6,.col-md-offset-7,.col-md-offset-8,.col-md-offset-9{box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:.5rem;padding-left:.5rem}.col-md{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:0;flex-basis:0;max-width:100%}.col-md-1{-ms-flex-preferred-size:8.33333333%;flex-basis:8.33333333%;max-width:8.33333333%}.col-md-2{-ms-flex-preferred-size:16.66666667%;flex-basis:16.66666667%;max-width:16.66666667%}.col-md-3{-ms-flex-preferred-size:25%;flex-basis:25%;max-width:25%}.col-md-4{-ms-flex-preferred-size:33.33333333%;flex-basis:33.33333333%;max-width:33.33333333%}.col-md-5{-ms-flex-preferred-size:41.66666667%;flex-basis:41.66666667%;max-width:41.66666667%}.col-md-6{-ms-flex-preferred-size:50%;flex-basis:50%;max-width:50%}.col-md-7{-ms-flex-preferred-size:58.33333333%;flex-basis:58.33333333%;max-width:58.33333333%}.col-md-8{-ms-flex-preferred-size:66.66666667%;flex-basis:66.66666667%;max-width:66.66666667%}.col-md-9{-ms-flex-preferred-size:75%;flex-basis:75%;max-width:75%}.col-md-10{-ms-flex-preferred-size:83.33333333%;flex-basis:83.33333333%;max-width:83.33333333%}.col-md-11{-ms-flex-preferred-size:91.66666667%;flex-basis:91.66666667%;max-width:91.66666667%}.col-md-12{-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.col-md-offset-0{margin-left:0}.col-md-offset-1{margin-left:8.33333333%}.col-md-offset-2{margin-left:16.66666667%}.col-md-offset-3{margin-left:25%}.col-md-offset-4{margin-left:33.33333333%}.col-md-offset-5{margin-left:41.66666667%}.col-md-offset-6{margin-left:50%}.col-md-offset-7{margin-left:58.33333333%}.col-md-offset-8{margin-left:66.66666667%}.col-md-offset-9{margin-left:75%}.col-md-offset-10{margin-left:83.33333333%}.col-md-offset-11{margin-left:91.66666667%}.start-md{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;text-align:start}.center-md{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;text-align:center}.end-md{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;text-align:end}.top-md{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.middle-md{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bottom-md{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.around-md{-ms-flex-pack:distribute;justify-content:space-around}.between-md{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.first-md{-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1}.last-md{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}}@media only screen and (min-width:75em){.container{width:76rem}.col-lg,.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-offset-0,.col-lg-offset-1,.col-lg-offset-10,.col-lg-offset-11,.col-lg-offset-12,.col-lg-offset-2,.col-lg-offset-3,.col-lg-offset-4,.col-lg-offset-5,.col-lg-offset-6,.col-lg-offset-7,.col-lg-offset-8,.col-lg-offset-9{box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:.5rem;padding-left:.5rem}.col-lg{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:0;flex-basis:0;max-width:100%}.col-lg-1{-ms-flex-preferred-size:8.33333333%;flex-basis:8.33333333%;max-width:8.33333333%}.col-lg-2{-ms-flex-preferred-size:16.66666667%;flex-basis:16.66666667%;max-width:16.66666667%}.col-lg-3{-ms-flex-preferred-size:25%;flex-basis:25%;max-width:25%}.col-lg-4{-ms-flex-preferred-size:33.33333333%;flex-basis:33.33333333%;max-width:33.33333333%}.col-lg-5{-ms-flex-preferred-size:41.66666667%;flex-basis:41.66666667%;max-width:41.66666667%}.col-lg-6{-ms-flex-preferred-size:50%;flex-basis:50%;max-width:50%}.col-lg-7{-ms-flex-preferred-size:58.33333333%;flex-basis:58.33333333%;max-width:58.33333333%}.col-lg-8{-ms-flex-preferred-size:66.66666667%;flex-basis:66.66666667%;max-width:66.66666667%}.col-lg-9{-ms-flex-preferred-size:75%;flex-basis:75%;max-width:75%}.col-lg-10{-ms-flex-preferred-size:83.33333333%;flex-basis:83.33333333%;max-width:83.33333333%}.col-lg-11{-ms-flex-preferred-size:91.66666667%;flex-basis:91.66666667%;max-width:91.66666667%}.col-lg-12{-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.col-lg-offset-0{margin-left:0}.col-lg-offset-1{margin-left:8.33333333%}.col-lg-offset-2{margin-left:16.66666667%}.col-lg-offset-3{margin-left:25%}.col-lg-offset-4{margin-left:33.33333333%}.col-lg-offset-5{margin-left:41.66666667%}.col-lg-offset-6{margin-left:50%}.col-lg-offset-7{margin-left:58.33333333%}.col-lg-offset-8{margin-left:66.66666667%}.col-lg-offset-9{margin-left:75%}.col-lg-offset-10{margin-left:83.33333333%}.col-lg-offset-11{margin-left:91.66666667%}.start-lg{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;text-align:start}.center-lg{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;text-align:center}.end-lg{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;text-align:end}.top-lg{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.middle-lg{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bottom-lg{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.around-lg{-ms-flex-pack:distribute;justify-content:space-around}.between-lg{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.first-lg{-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1}.last-lg{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}}
.Toastify__toast-container {
  z-index: 9999;
  -webkit-transform: translate3d(0, 0, 9999px);
  position: fixed;
  padding: 4px;
  width: 320px;
  box-sizing: border-box;
  color: #fff;
}
.Toastify__toast-container--top-left {
  top: 1em;
  left: 1em;
}
.Toastify__toast-container--top-center {
  top: 1em;
  left: 50%;
  transform: translateX(-50%);
}
.Toastify__toast-container--top-right {
  top: 1em;
  right: 1em;
}
.Toastify__toast-container--bottom-left {
  bottom: 1em;
  left: 1em;
}
.Toastify__toast-container--bottom-center {
  bottom: 1em;
  left: 50%;
  transform: translateX(-50%);
}
.Toastify__toast-container--bottom-right {
  bottom: 1em;
  right: 1em;
}

@media only screen and (max-width : 480px) {
  .Toastify__toast-container {
    width: 100vw;
    padding: 0;
    left: 0;
    margin: 0;
  }
  .Toastify__toast-container--top-left, .Toastify__toast-container--top-center, .Toastify__toast-container--top-right {
    top: 0;
    transform: translateX(0);
  }
  .Toastify__toast-container--bottom-left, .Toastify__toast-container--bottom-center, .Toastify__toast-container--bottom-right {
    bottom: 0;
    transform: translateX(0);
  }
  .Toastify__toast-container--rtl {
    right: 0;
    left: initial;
  }
}
.Toastify__toast {
  position: relative;
  min-height: 64px;
  box-sizing: border-box;
  margin-bottom: 1rem;
  padding: 8px;
  border-radius: 1px;
  box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 15px 0 rgba(0, 0, 0, 0.05);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
      justify-content: space-between;
  max-height: 800px;
  overflow: hidden;
  font-family: sans-serif;
  cursor: pointer;
  direction: ltr;
}
.Toastify__toast--rtl {
  direction: rtl;
}
.Toastify__toast--dark {
  background: #121212;
  color: #fff;
}
.Toastify__toast--default {
  background: #fff;
  color: #aaa;
}
.Toastify__toast--info {
  background: #3498db;
}
.Toastify__toast--success {
  background: #07bc0c;
}
.Toastify__toast--warning {
  background: #f1c40f;
}
.Toastify__toast--error {
  background: #e74c3c;
}
.Toastify__toast-body {
  margin: auto 0;
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
}

@media only screen and (max-width : 480px) {
  .Toastify__toast {
    margin-bottom: 0;
  }
}
.Toastify__close-button {
  color: #fff;
  background: transparent;
  outline: none;
  border: none;
  padding: 0;
  cursor: pointer;
  opacity: 0.7;
  transition: 0.3s ease;
  -ms-flex-item-align: start;
      align-self: flex-start;
}
.Toastify__close-button--default {
  color: #000;
  opacity: 0.3;
}
.Toastify__close-button > svg {
  fill: currentColor;
  height: 16px;
  width: 14px;
}
.Toastify__close-button:hover, .Toastify__close-button:focus {
  opacity: 1;
}

@keyframes Toastify__trackProgress {
  0% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(0);
  }
}
.Toastify__progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  z-index: 9999;
  opacity: 0.7;
  background-color: rgba(255, 255, 255, 0.7);
  transform-origin: left;
}
.Toastify__progress-bar--animated {
  animation: Toastify__trackProgress linear 1 forwards;
}
.Toastify__progress-bar--controlled {
  transition: transform 0.2s;
}
.Toastify__progress-bar--rtl {
  right: 0;
  left: initial;
  transform-origin: right;
}
.Toastify__progress-bar--default {
  background: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);
}
.Toastify__progress-bar--dark {
  background: #bb86fc;
}
@keyframes Toastify__bounceInRight {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(-25px, 0, 0);
  }
  75% {
    transform: translate3d(10px, 0, 0);
  }
  90% {
    transform: translate3d(-5px, 0, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutRight {
  20% {
    opacity: 1;
    transform: translate3d(-20px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}
@keyframes Toastify__bounceInLeft {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }
  75% {
    transform: translate3d(-10px, 0, 0);
  }
  90% {
    transform: translate3d(5px, 0, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutLeft {
  20% {
    opacity: 1;
    transform: translate3d(20px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }
}
@keyframes Toastify__bounceInUp {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  75% {
    transform: translate3d(0, 10px, 0);
  }
  90% {
    transform: translate3d(0, -5px, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__bounceOutUp {
  20% {
    transform: translate3d(0, -10px, 0);
  }
  40%, 45% {
    opacity: 1;
    transform: translate3d(0, 20px, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}
@keyframes Toastify__bounceInDown {
  from, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, 25px, 0);
  }
  75% {
    transform: translate3d(0, -10px, 0);
  }
  90% {
    transform: translate3d(0, 5px, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutDown {
  20% {
    transform: translate3d(0, 10px, 0);
  }
  40%, 45% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}
.Toastify__bounce-enter--top-left, .Toastify__bounce-enter--bottom-left {
  animation-name: Toastify__bounceInLeft;
}
.Toastify__bounce-enter--top-right, .Toastify__bounce-enter--bottom-right {
  animation-name: Toastify__bounceInRight;
}
.Toastify__bounce-enter--top-center {
  animation-name: Toastify__bounceInDown;
}
.Toastify__bounce-enter--bottom-center {
  animation-name: Toastify__bounceInUp;
}

.Toastify__bounce-exit--top-left, .Toastify__bounce-exit--bottom-left {
  animation-name: Toastify__bounceOutLeft;
}
.Toastify__bounce-exit--top-right, .Toastify__bounce-exit--bottom-right {
  animation-name: Toastify__bounceOutRight;
}
.Toastify__bounce-exit--top-center {
  animation-name: Toastify__bounceOutUp;
}
.Toastify__bounce-exit--bottom-center {
  animation-name: Toastify__bounceOutDown;
}

@keyframes Toastify__zoomIn {
  from {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}
@keyframes Toastify__zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}
.Toastify__zoom-enter {
  animation-name: Toastify__zoomIn;
}

.Toastify__zoom-exit {
  animation-name: Toastify__zoomOut;
}

@keyframes Toastify__flipIn {
  from {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  to {
    transform: perspective(400px);
  }
}
@keyframes Toastify__flipOut {
  from {
    transform: perspective(400px);
  }
  30% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  to {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}
.Toastify__flip-enter {
  animation-name: Toastify__flipIn;
}

.Toastify__flip-exit {
  animation-name: Toastify__flipOut;
}

@keyframes Toastify__slideInRight {
  from {
    transform: translate3d(110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideInLeft {
  from {
    transform: translate3d(-110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideInUp {
  from {
    transform: translate3d(0, 110%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideInDown {
  from {
    transform: translate3d(0, -110%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
@keyframes Toastify__slideOutRight {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(110%, 0, 0);
  }
}
@keyframes Toastify__slideOutLeft {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(-110%, 0, 0);
  }
}
@keyframes Toastify__slideOutDown {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, 500px, 0);
  }
}
@keyframes Toastify__slideOutUp {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, -500px, 0);
  }
}
.Toastify__slide-enter--top-left, .Toastify__slide-enter--bottom-left {
  animation-name: Toastify__slideInLeft;
}
.Toastify__slide-enter--top-right, .Toastify__slide-enter--bottom-right {
  animation-name: Toastify__slideInRight;
}
.Toastify__slide-enter--top-center {
  animation-name: Toastify__slideInDown;
}
.Toastify__slide-enter--bottom-center {
  animation-name: Toastify__slideInUp;
}

.Toastify__slide-exit--top-left, .Toastify__slide-exit--bottom-left {
  animation-name: Toastify__slideOutLeft;
}
.Toastify__slide-exit--top-right, .Toastify__slide-exit--bottom-right {
  animation-name: Toastify__slideOutRight;
}
.Toastify__slide-exit--top-center {
  animation-name: Toastify__slideOutUp;
}
.Toastify__slide-exit--bottom-center {
  animation-name: Toastify__slideOutDown;
}