.red-line-L {
  width: 100%;
  height: 100vh;
  background: url(../images/red-line-L.png) no-repeat top center;
  background-size: 545px;
  position: absolute;
  top: -100px;
  left: 0;
  transform: translate(0%, 0);
  -webkit-animation-name: barjump;
  -ms-animation-name: barjump;
  animation-name: barjump;
  -webkit-animation-duration: 0.8s;
  -ms-animation-duration: 0.8s;
  animation-duration: 0.8s;
  -webkit-animation-timing-function: linear;
  -ms-animation-timing-function: linear;
  animation-timing-function: linear;
  }
  @-webkit-keyframes barjump{
  0%{top:-1000px;transform:scale(1);}
  70%{top:-100px;transform:scale(1);}
  to{top:-100px;transform:scale(1);}}
  
  .red-line-S {
      width: 100%;
      height: 100vh;
      background: url(../images/red-line-S.png) no-repeat top center;
      background-size: 200px;
      position: absolute;
      top: 50px;
      left: 30px;
      transform: translate(0%, 0);
      -webkit-animation-name: barjump-r-s;
      animation-name: barjump-r-s;
      -webkit-animation-duration: 0.8s;
      animation-duration: 0.8s;
      -webkit-animation-timing-function: linear;
      animation-timing-function: linear;
      }
      @-webkit-keyframes barjump-r-s{
      0%{top:-1000px;transform:scale(1)}
      70%{top:50px;transform:scale(1)}
      to{top:50px;transform:scale(1)}}
  
  .blu-line-L {
      width: 100%;
      height: 100vh;
      background: url(../images/blu-line-L.png) no-repeat top center;
      background-size: 545px;
      position: absolute;
      bottom: -50px;
      right: 30px;
      transform: translate(0%, 0);
      -webkit-animation-name: barjump-b-l;
      animation-name: barjump-b-l;
      -webkit-animation-duration: 1s;
      animation-duration: 1s;
      -webkit-animation-timing-function: linear;
      animation-timing-function: linear;
  
      }
      @-webkit-keyframes barjump-b-l{
      0%{bottom:-1000px;transform:scale(1)}
      70%{bottom:-50px;transform:scale(1)}
      to{bottom:-50px;transform:scale(1)}}
  
  .blu-line-S {
      width: 100%;
      height: 100vh;
      background: url(../images/blu-line-S.png) no-repeat top center;
      background-size: 200px;
      position: absolute;
      bottom: -520px;
      right: 0;
      transform: translate(0%, 0);
      -webkit-animation-name: barjump-s;
      animation-name: barjump-s;
      -webkit-animation-duration: 1s;
      animation-duration: 1s;
      -webkit-animation-timing-function: linear;
      animation-timing-function: linear;
      }
      @-webkit-keyframes barjump-s{
      0%{bottom:-1000px;transform:scale(1)}
      70%{bottom:-520px;transform:scale(1)}
      to{bottom:-520px;transform:scale(1)}}