.pf-loading-bars-container{
  position: relative;
  z-index: 4;
  margin: 0 auto;
  left: 5px;
  right: 19px;
  width: 70px;
  height: 50px;
  list-style: none;

  .pf-loading-bars-loader{
    position: absolute;
    z-index: 3;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 50%;
    margin-top: -19px;
    width: 56px;
    height: 37px;
    list-style: none;

    li{
      background-color: $green;
      width: 6px;
      height: 6px;
      float: right;
      margin-right: 3px !important;
      @include box-shadow(0px 12px 6px rgba(0,0,0,0.2));

      &:first-child{
        @include animation( cssload-loadbars 1.75s cubic-bezier(0.645,0.045,0.355,1) infinite 0s );
      }

      &:nth-child(2){
        @include animation( cssload-loadbars 1.75s ease-in-out infinite -0.35s );
      }

      &:nth-child(3){
        @include animation( cssload-loadbars 1.75s ease-in-out infinite -0.7s );
      }

      &:nth-child(4){
        @include animation( cssload-loadbars 1.75s ease-in-out infinite -1.05s );
      }

      &:nth-child(5){
        @include animation( cssload-loadbars 1.75s ease-in-out infinite -1.4s );
      }

      &:nth-child(6){
        @include animation( cssload-loadbars 1.75s ease-in-out infinite -1.75s );
      }
    }
  }
}

@include keyframes(cssload-loadbars){
  0%{
    height: 6px;
    margin-top: 16px;
  }
  33%{
    height: 6px;
    margin-top: 16px;
  }
  66%{
    height:31px;
    margin-top: 0px;
  }
  100%{
    height: 6px;
    margin-top: 16px;
  }
}