.zoomsounds-nav{



  &.skin-wave{
    .menu-item{

      display: flex;
      align-items: center;

      padding-right:0;
      opacity: 0.7;
      $transition-property: opacity;
      $transition-duration: .3s;
      $transition-timing: ease-out;

      @include apply_transition($transition-property, $transition-duration, $transition-timing);

      &.active-from-gallery{
        opacity: 1;
      }

      .the-artist{


        display: block;
      }
      .float-right{
        position: absolute;
        top:10px;
        right: 10px;
        float:none;
      }
      .the-name{
        font-size: 13px;
        display: block;

      }

      .menu-artist-info{
        flex: 100;

        text-align: right;
      }

      .menu-item-thumb-con{
        width: 50px;
        height: 50px;
        margin:10px;
        flex: 0 0 auto;

        .menu-item-thumb{
          border-radius: 50% 50%;
          box-shadow: 0 0 5px 0 rgba(0,0,0,0.3);

        }
      }



      &.no-thumb{
        position: relative;
        padding-right: 0;
        text-align: right;

        margin-bottom: 10px;

        span.the-name{
          position: relative;

          top:0;
        }
        .menu-item.no-thumb{
          .the-artist{

            position: static;
            float:left;

          }
        }
      }
    }





    .menu-item:before{
      content: " ";
      width: 100%;
      height: 1px;
      position: absolute;
      top:100%;

      opacity: 0.2;

      background: -moz-linear-gradient(left, rgba(180,179,177,0) 0%, rgba(180,179,177,1) 20%, rgba(180,179,177,1) 21%, rgba(181,180,177,1) 80%, rgba(181,180,177,1) 81%, rgba(181,180,177,0) 100%);
      background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(180,179,177,0)), color-stop(20%,rgba(180,179,177,1)), color-stop(21%,rgba(180,179,177,1)), color-stop(80%,rgba(181,180,177,1)), color-stop(81%,rgba(181,180,177,1)), color-stop(100%,rgba(181,180,177,0)));
      background: -webkit-linear-gradient(left, rgba(180,179,177,0) 0%,rgba(180,179,177,1) 20%,rgba(180,179,177,1) 21%,rgba(181,180,177,1) 80%,rgba(181,180,177,1) 81%,rgba(181,180,177,0) 100%);
      background: -o-linear-gradient(left, rgba(180,179,177,0) 0%,rgba(180,179,177,1) 20%,rgba(180,179,177,1) 21%,rgba(181,180,177,1) 80%,rgba(181,180,177,1) 81%,rgba(181,180,177,0) 100%);
      background: -ms-linear-gradient(left, rgba(180,179,177,0) 0%,rgba(180,179,177,1) 20%,rgba(180,179,177,1) 21%,rgba(181,180,177,1) 80%,rgba(181,180,177,1) 81%,rgba(181,180,177,0) 100%);
      background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #ffffff 20%, #ffffff 21%, #ffffff 80%, #ffffff 81%, rgba(255, 255, 255, 0) 100%);

    }


  }
}
