.zoomsounds-nav{
  &.skin-aura{
    .menu-item{
      padding: 10px;
      background-color: transparent;
      color :#222;
      line-height: 1;
      max-width: 100%;
      text-overflow: ellipsis;
      opacity: 0.65;

      display: flex;
      align-items: center;
      align-content: center;

      $transition-property: opacity;
      $transition-duration: .3s;
      $transition-timing: ease-out;
      @include apply_transition($transition-property, $transition-duration, $transition-timing);
      border-bottom: 1px solid rgba(0,0,0,.1);

      .menu-item-number{


        flex: 0 0 auto;

        margin-right: 10px;

        font-style: italic;


      }

      .menu-item-thumb-con{
        flex: 0 0 auto;
        margin-right: 10px;
      }

      .menu-artist-info{
        flex: 100;
        white-space:nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }

      .menu-item-views {

        position: absolute;
        top:50%;
        right:10px;


        pointer-events: none;

        $transition-property: opacity;
        $transition-duration: .3s;
        $transition-timing: ease-out;
        @include apply_transition($transition-property, $transition-duration, $transition-timing);

        transform: translate3d(0,-50%,0);
      }


      .float-right{

        flex: 0 0 auto;
        text-align: right;
        float: none;
        margin-left: 15px;

        opacity: 0;


        $transition-property: opacity;
        $transition-duration: .3s;
        $transition-timing: ease-out;
        @include apply_transition($transition-property, $transition-duration, $transition-timing);
      }

      .the-artist{

        display: inline-block;
        position: relative;
        vertical-align: middle;
        margin-right: 10px;
        font-weight: bold;
      }
      .the-name{
        float: none;
        display: inline-block;
        vertical-align: middle;
        margin-right: 10px;
        opacity: 0.5;
        font-weight: bold;


        white-space:nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }


      .float-right {
        > a {
          display: inline-block;
          vertical-align: top;
          font-size:0;
        }

      }

      &.has-extra-info{
        &:hover{


          .menu-item-views{
            opacity: 0;
          }
          .float-right{
            opacity: 1;
          }
        }
      }
    }
    .menu-item:nth-child(odd){

    }
    .menu-item.active{
      opacity: 1;
    }
    .menu-item:last-child{
      border-bottom: 0;
    }
  }
}
