.logout {
  position: fixed;
  top: 0;
  right: 0;
  min-width: 19rem;
  -webkit-font-smoothing: antialiased;
  z-index: 999;
  > div {
    height: 6rem;
    width: 100%;
    line-height: 6rem;
    z-index: 999;
    > button {
      width: 100%;
      padding-right: 30px;
      background: transparent;
      border: none;
      border-radius: 0;
      color: #333740;
      font-size: 14px;
      font-weight: 500;
      text-align: right;
      cursor: pointer;
      transition: background .2s ease-out;

      &:hover, &:focus, &:active {
        color: #333740;
        background-color: #FAFAFB !important;
      }

      > i {
        margin-left: 10px;
        transition: transform .3s ease-out;

        &[alt="true"] {
          transform: rotateX(180deg);
        }
      }
    }
  }


}
.dropDownContent {
  // top: -1px;
  left: auto !important;
  right: -5px !important;
  min-width: 100%!important;
  margin: 0 !important;
  padding: 0;
  line-height: 1.8rem;
  border: none!important;
  border-top-left-radius: 0!important;
  border-top-right-radius: 0!important;
  font-size: 14px;
  overflow: hidden;
  box-shadow: 0 1px 4px 0px rgba(40, 42, 49, 0.05);

  &:before{
    content: '';
    position: absolute;
    top: -3px;
    left: -1px;
    width: calc(100% + 1px);
    height: 3px;
    box-shadow: 0 1px 2px 0 rgba(40, 42, 49, 0.16);
  }

  > button {
    height: 40px;
    padding: 0px 15px;
    line-height: 40px;
    &:hover, &:focus, &:active {
      background-color: #FAFAFB!important;
      border-radius: 0px;
      cursor: pointer;
    }
  }

  > button:first-child {
    height: 44px;
    line-height: 48px;
    &:hover, &:active {
      color: #333740;
    }
  }

  > button:not(:first-child) {
    color: #F75B1D;
    > i {
      margin-left: 10px
    }
  }
}

.item {
  &:active {
    color: black;
  }
  &:hover {
    background-color: #FAFAFB !important;
  }
}