:root {
  --first-color: #447c7d;
  --sidebar-submenu-background-color: linear-gradient(
    to bottom,
    #263b4d,
    #233748
  );
  --sidebar-submenu-border-color: #77afb0;
  --sidebar-menu-item-hover-background-color: #9fc8ca;
  --sidebar-menu-item-active-background-color-darken-5: #6aa2a3;
  --sidebar-menu-item-active-background-color-darken-20: #447c7d;
  --sidebar-menu-item-active-text-color: white;
  --sidebar-menu-item-active-icon-color: white;
  --sidebar-menu-item-text-color: white;
  --sidebar-menu-item-icon-color: white;
  --sidebar-menu-item-active-background-color: linear-gradient(
    to right,
    rgba(255, 255, 255, 0.4) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --sidebar-menu-item-hover-background-color: linear-gradient(
    to right,
    rgba(255, 255, 255, 0.2) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );

  --ray-menu-background-color: linear-gradient(
    to right bottom,
    #203142,
    #1d2d3c,
    #1a2836,
    #182431,
    #15202b
  );

  --ray-header-background-color: white;
  --header-font-color: black;

  --context-menu-background-color: white;
  --context-menu-icon-color: black;
  --context-menu-text-color: black;
  --context-menu-active-icon-color: white;
  --context-menu-active-text-color: white;

  --header-background-color: #111;
  --header-accent-color: #77afb0; /*secondColor*/
  --header-accent-color-darken-5: #6aa2a3;
  --header-accent-color-darken-20: #447c7d;
  --header-profile-text-color: white;

  --editor-header-background-color: #4e4e4e;
  --editor-header-text-color: white;

  --main-content-background-color: #eee;

  --login-input-field-icon-color: gray;
  --login-input-field-text-color: gray;
  --login-input-field-background-color: white;
  --login-button-background-color: #343a40;
  --login-button-background-color-hover: #01070d;
  --login-button-text-color: white;
  --login-remember-me-text-color: #343a40;

  --select-option-selected-color: white;

  --collapsed-size-height: 34px;
  --collapsed-size-width: 200px;
  --collapsed-logo-src: url(/assets/images/logo/logo_compact.png) no-repeat;

  --expanded-size-height: 30px;
  --expanded-size-width: 200px;
  --expanded-logo-src: url(/assets/images/logo/logo_fullwidth.png) no-repeat;

  --login-logo-src: url(/assets/images/logo/Logo_RAYMASTER_bright.png) no-repeat;
  --login-logo-size-height: 100px;
  --login-logo-size-width: 70%;

  --login-background: url(/assets/images/background/login-background.jpg);
  --fontPack-primary: 'Segoe UI', 'sans-serif';
  --fontPack-secondary: 'Source Sans Pro', 'Segoe UI', 'sans-serif';
}