adi_cae_web/theme/menu.css

/* BEM support Func
 -------------------------- */
/* Element Chalk Variables */
/* Transition
-------------------------- */
/* Colors
-------------------------- */
/* 53a8ff */
/* 66b1ff */
/* 79bbff */
/* 8cc5ff */
/* a0cfff */
/* b3d8ff */
/* c6e2ff */
/* d9ecff */
/* ecf5ff */
/* Link
-------------------------- */
/* Background
-------------------------- */
/* Border
-------------------------- */
/* Box-shadow
-------------------------- */
/* Fill
-------------------------- */
/* Font
-------------------------- */
/* Size
-------------------------- */
/* z-index
-------------------------- */
/* Disable base
-------------------------- */
/* Icon
-------------------------- */
/* Checkbox
-------------------------- */
/* Radio
-------------------------- */
/* Select
-------------------------- */
/* Alert
-------------------------- */
/* Message Box
-------------------------- */
/* Message
-------------------------- */
/* Notification
-------------------------- */
/* Input
-------------------------- */
/* Cascader
-------------------------- */
/* Group
-------------------------- */
/* Tab
-------------------------- */
/* Button
-------------------------- */
/* cascader
-------------------------- */
/* Switch
-------------------------- */
/* Dialog
-------------------------- */
/* Table
-------------------------- */
/* Pagination
-------------------------- */
/* Popover
-------------------------- */
/* Tooltip
-------------------------- */
/* Tag
-------------------------- */
/* Tree
-------------------------- */
/* Dropdown
-------------------------- */
/* Badge
-------------------------- */
/* Card
--------------------------*/
/* Slider
--------------------------*/
/* Steps
--------------------------*/
/* MenuSlide
--------------------------*/
/* Rate
--------------------------*/
/* DatePicker
--------------------------*/
/* Loading
--------------------------*/
/* Scrollbar
--------------------------*/
/* Carousel
--------------------------*/
/* Collapse
--------------------------*/
/* Transfer
--------------------------*/
/* Header
  --------------------------*/
/* Footer
--------------------------*/
/* Main
--------------------------*/
/* Break-point
--------------------------*/
/* Break-points
 -------------------------- */
/* Scrollbar
 -------------------------- */
/* Placeholder
 -------------------------- */
/* BEM
 -------------------------- */
/* Element Chalk Variables */
/* Transition
-------------------------- */
/* Colors
-------------------------- */
/* 53a8ff */
/* 66b1ff */
/* 79bbff */
/* 8cc5ff */
/* a0cfff */
/* b3d8ff */
/* c6e2ff */
/* d9ecff */
/* ecf5ff */
/* Link
-------------------------- */
/* Background
-------------------------- */
/* Border
-------------------------- */
/* Box-shadow
-------------------------- */
/* Fill
-------------------------- */
/* Font
-------------------------- */
/* Size
-------------------------- */
/* z-index
-------------------------- */
/* Disable base
-------------------------- */
/* Icon
-------------------------- */
/* Checkbox
-------------------------- */
/* Radio
-------------------------- */
/* Select
-------------------------- */
/* Alert
-------------------------- */
/* Message Box
-------------------------- */
/* Message
-------------------------- */
/* Notification
-------------------------- */
/* Input
-------------------------- */
/* Cascader
-------------------------- */
/* Group
-------------------------- */
/* Tab
-------------------------- */
/* Button
-------------------------- */
/* cascader
-------------------------- */
/* Switch
-------------------------- */
/* Dialog
-------------------------- */
/* Table
-------------------------- */
/* Pagination
-------------------------- */
/* Popover
-------------------------- */
/* Tooltip
-------------------------- */
/* Tag
-------------------------- */
/* Tree
-------------------------- */
/* Dropdown
-------------------------- */
/* Badge
-------------------------- */
/* Card
--------------------------*/
/* Slider
--------------------------*/
/* Steps
--------------------------*/
/* MenuSlide
--------------------------*/
/* Rate
--------------------------*/
/* DatePicker
--------------------------*/
/* Loading
--------------------------*/
/* Scrollbar
--------------------------*/
/* Carousel
--------------------------*/
/* Collapse
--------------------------*/
/* Transfer
--------------------------*/
/* Header
  --------------------------*/
/* Footer
--------------------------*/
/* Main
--------------------------*/
/* Break-point
--------------------------*/
.el-menu {
  border-right: solid 1px #e6e6e6;
  list-style: none;
  position: relative;
  margin: 0;
  padding-left: 0;
  background-color: #1b1e24; }
  .el-menu::before, .el-menu::after {
    display: table;
    content: ""; }
  .el-menu::after {
    clear: both; }
  .el-menu li {
    list-style: none; }
  .el-menu--horizontal {
    border-right: none;
    border-bottom: solid 1px #e6e6e6; }
    .el-menu--horizontal .el-menu-item {
      float: left;
      height: 60px;
      line-height: 60px;
      margin: 0;
      cursor: pointer;
      position: relative;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      border-bottom: 2px solid transparent;
      color: #878d99; }
      .el-menu--horizontal .el-menu-item a, .el-menu--horizontal .el-menu-item a:hover {
        color: inherit; }
      .el-menu--horizontal .el-menu-item:hover, .el-menu--horizontal .el-menu-item:focus {
        background-color: #fff; }
    .el-menu--horizontal .el-submenu {
      float: left;
      position: relative; }
      .el-menu--horizontal .el-submenu:focus {
        outline: none; }
        .el-menu--horizontal .el-submenu:focus > .el-submenu__title {
          color: #8b91a0; }
      .el-menu--horizontal .el-submenu > .el-menu {
        position: absolute;
        top: 65px;
        left: 0;
        border: none;
        padding: 5px 0;
        background-color: #fff;
        z-index: 100;
        min-width: 100%;
        -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
        border-radius: 2px; }
      .el-menu--horizontal .el-submenu .el-submenu__title {
        height: 60px;
        line-height: 60px;
        border-bottom: 2px solid transparent;
        color: #878d99; }
      .el-menu--horizontal .el-submenu .el-submenu__title:hover {
        background-color: #fff; }
      .el-menu--horizontal .el-submenu .el-menu-item {
        background-color: #fff;
        float: none;
        height: 36px;
        line-height: 36px;
        padding: 0 10px; }
      .el-menu--horizontal .el-submenu .el-submenu__icon-arrow {
        position: static;
        vertical-align: middle;
        margin-left: 8px;
        margin-top: -3px; }
    .el-menu--horizontal .el-menu-item:hover, .el-menu--horizontal .el-submenu__title:hover, .el-menu--horizontal .el-menu-item:focus {
      outline: none;
      color: #8b91a0; }
    .el-menu--horizontal > .el-menu-item.is-active, .el-menu--horizontal > .el-submenu.is-active .el-submenu__title {
      border-bottom: 2px solid #1b1e24;
      color: #8b91a0; }
  .el-menu--collapse {
    width: 64px; }
    .el-menu--collapse > .el-menu-item [class^="el-icon-"], .el-menu--collapse > .el-submenu > .el-submenu__title [class^="el-icon-"] {
      margin: 0;
      vertical-align: middle;
      width: 24px;
      text-align: center; }
    .el-menu--collapse > .el-menu-item .el-submenu__icon-arrow, .el-menu--collapse > .el-submenu > .el-submenu__title .el-submenu__icon-arrow {
      display: none; }
    .el-menu--collapse > .el-menu-item span, .el-menu--collapse > .el-submenu > .el-submenu__title span {
      height: 0;
      width: 0;
      overflow: hidden;
      visibility: hidden;
      display: inline-block; }
    .el-menu--collapse > .el-menu-item.is-active i {
      color: inherit; }
    .el-menu--collapse .el-menu .el-submenu {
      min-width: 200px; }
    .el-menu--collapse .el-submenu {
      position: relative; }
      .el-menu--collapse .el-submenu .el-menu {
        position: absolute;
        margin-left: 5px;
        top: 0;
        left: 100%;
        z-index: 10;
        border: 1px solid #dfe4ed;
        border-radius: 2px;
        -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); }
      .el-menu--collapse .el-submenu.is-opened > .el-submenu__title .el-submenu__icon-arrow {
        -webkit-transform: none;
        transform: none; }

.el-menu-item {
  height: 56px;
  line-height: 56px;
  font-size: 14px;
  color: #8b91a0;
  padding: 0 20px;
  cursor: pointer;
  position: relative;
  -webkit-transition: border-color .3s, background-color .3s, color .3s;
  transition: border-color .3s, background-color .3s, color .3s;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  white-space: nowrap; }
  .el-menu-item [class^="el-icon-"] {
    margin-right: 5px;
    width: 24px;
    text-align: center;
    font-size: 18px; }
  .el-menu-item * {
    vertical-align: middle; }
  .el-menu-item:first-child {
    margin-left: 0; }
  .el-menu-item:last-child {
    margin-right: 0; }
  .el-menu-item:hover, .el-menu-item:focus {
    outline: none;
    background-color: #262A33; }
  .el-menu-item i {
    color: #878d99; }
  .el-menu-item.is-active {
    color: #1b1e24; }
    .el-menu-item.is-active i {
      color: inherit; }

.el-submenu__title {
  position: relative;
  height: 56px;
  line-height: 56px;
  font-size: 14px;
  color: #8b91a0;
  padding: 0 20px;
  cursor: pointer;
  position: relative;
  -webkit-transition: border-color .3s, background-color .3s, color .3s;
  transition: border-color .3s, background-color .3s, color .3s;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  white-space: nowrap; }
  .el-submenu__title * {
    vertical-align: middle; }
  .el-submenu__title i {
    color: #878d99; }
  .el-submenu__title:hover {
    background-color: #262A33; }

.el-submenu .el-menu {
  border: none; }

.el-submenu .el-menu-item {
  height: 50px;
  line-height: 50px;
  padding: 0 45px;
  min-width: 200px; }

.el-submenu__icon-arrow {
  position: absolute;
  top: 50%;
  right: 20px;
  margin-top: -7px;
  -webkit-transition: -webkit-transform .3s;
  transition: -webkit-transform .3s;
  transition: transform .3s;
  transition: transform .3s, -webkit-transform .3s;
  font-size: 12px; }

.el-submenu.is-active .el-submenu__title {
  border-bottom-color: #1b1e24; }

.el-submenu.is-opened > .el-submenu__title .el-submenu__icon-arrow {
  -webkit-transform: rotateZ(180deg);
  transform: rotateZ(180deg); }

.el-submenu [class^="el-icon-"] {
  vertical-align: middle;
  margin-right: 5px;
  width: 24px;
  text-align: center;
  font-size: 18px; }

.el-menu-item-group > ul {
  padding: 0; }

.el-menu-item-group__title {
  padding: 7px 0 7px 20px;
  line-height: normal;
  font-size: 12px;
  color: #878d99; }

.horizontal-collapse-transition .el-submenu__title .el-submenu__icon-arrow {
  -webkit-transition: .2s;
  transition: .2s;
  opacity: 0; }