.no-select {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.size {
  width: 100%;
  height: 100%;
}

//.tags-nav .scroll-outer .scroll-body span .ivu-tag-default {
//  background: #fff !important;
//}

.home-class{
  z-index: 999;
  background: #fff;
  position: absolute;
  box-shadow: 0px 0 3px 2px rgba(100, 100, 100, 0.1) inset;
  display: flex;
  align-items: end;
  height: 64px;
  background: rgba(23, 80, 189, 1);

  .ivu-tag{
    margin: 0;
    border-radius: 0;
    height: 52px;
    line-height: 52px;
    text-align: center;
    border-radius: 4px 4px 0 0!important;
    cursor: pointer;
  }

}

.tags-nav {
  position: relative;
  min-width: 500px;
  background: #fff;
  .no-select;
  .size;

  .close-con {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 32px;
    background: #fff;
    text-align: center;
    z-index: 10;
  }

  .btn-con {
    position: absolute;
    top: 0px;
    height: 100%;
    padding-top: 3px;
    z-index: 10;
    height: 100%;
    cursor: pointer;

    button {
      padding: 6px 4px;
      line-height: 14px;
      text-align: center;
      background: rgba(23, 80, 189, 1);
    }

    &.left-btn {
      background: rgba(23, 80, 189, 1);
      left: 0px;
    }

    &.right-btn {
      background: rgba(23, 80, 189, 1);
      right: 0px;
      //border-right: 1px solid #F0F0F0;
    }
  }
  .tag-button{
    outline:none!important;  /*去除点击时的蓝色边框*/
    box-shadow:none!important; /*同时去除阴影的蓝色边框*/
  }

  .scroll-outer {
    position: absolute;
    left: 70px;
    right: 42px;
    top: 0;
    bottom: 0;
    overflow: hidden;
    //overflow-x: visible;
    //overflow-y: hidden;
    //white-space: nowrap;
    box-shadow: 0px 0 3px 2px rgba(100, 100, 100, .1) inset;
    background: rgba(23, 80, 189, 1);
    height: 64px;

    .scroll-body {
      height: 64px;
      display: flex;
      padding: 0;
      position: absolute;
      overflow-x: visible;
      overflow-y:hidden;
      white-space: nowrap;
      transition: left .3s ease;
      align-items: end;

      .ivu-tag-dot-inner {
        transition: background .2s ease;
      }

      span {
        .ivu-tag-default {
          background: #fff;
        }
      }
    }

    .ivu-tag {
      margin: 0;
      height: 52px;
      line-height: 52px;
      text-align: center;
      //background: #fff ;
      border-radius: 4px 4px 0 0!important;
      cursor: pointer;
    }
    //.ivu-tag:hover{
    //  background-color: rgba(222, 230, 255, 1)!important;
    //  border-color:transparent!important;
    //}
  }


  .contextmenu {
    position: absolute;
    margin: 0;
    padding: 5px 0;
    background: #fff;
    z-index: 1000;
    list-style-type: none;
    border-radius: 4px;
    box-shadow: 2px 2px 3px 2px rgba(0, 0, 0, .1);
    min-width: 80px;

    li {
      margin: 0;
      padding: 5px 15px;
      cursor: pointer;

      &:hover {
        background: #eee;
      }
    }
  }
}

.main {
  .tag-nav-wrapper {
    height: 30px !important;
    display: flex;
  }
}

.tags-nav .btn-con {
  padding-top: 0;
}


.ivu-icon-ios-close-circle-outline {
  font-size: 14px !important;
}

.ivu-icon-ios-arrow-back {
  font-size: 14px !important;
}

.ivu-icon-ios-arrow-forward {
  font-size: 14px !important;
}

.tags-nav .btn-con button {
  color: #ffffff;

}
