.evaluate {
  display: inline-block;
  position: relative;
  cursor: pointer;
  .icon-evaluate {
     margin: 12px 10px 0;
  }
  &-main {
    position: absolute;
    z-index: 5;
    width: 315px;
    top: -275px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    header {
      h1 {
        font-size: 12px;
        text-align: center;
      }
    }
    footer {
      font-size: 12px;
      text-align: center;
    }
  }
  &-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12px 0;
    background: url('https://web.sdk.qcloud.com/im/assets/images/login-background.png') no-repeat;
    background-size: cover;
    background-position-x: 128px;
    background-position-y: 77px;
    textarea {
      box-sizing: border-box;
      width: 288px;
      height: 90px;
      margin: 12px 0;
      padding: 12px;
      border-radius: 2px;
      resize: none;
    }
    .btn {
      border: none;
      border-radius: 5px;
      font-size: 12px;
      text-align: center;
      line-height: 24px;
      padding: 2px 46px;
      cursor: pointer;
    }
  }
  &-list {
    flex: 1;
    display: flex;
    &-item {
      width: 24px;
      height: 24px;
      text-align: center;
      cursor: pointer;
      padding: 4px 0;
      font-size: 12px;
      padding-right: 15px;
      &:last-child{
        padding-right: 0 !important;
      }
    }
  }
}