
/*WAVE INICIO*/

.wave{
    width: 6000px;
    height: 95%;
    position: absolute;
    top: -150px;
    left: 0;
    background-image: url(../images/wd1.svg);
    filter: brightness(0) saturate(100%) invert(10%) sepia(52%) saturate(6550%) hue-rotate(339deg) brightness(93%) contrast(98%);
}

.w1{
    animation: w1 7s linear infinite;
}

.w2{
    animation: w2 7s linear -.125s infinite, desplazamiento 7s ease -.125s infinite;
    opacity: 0.5;
}

@keyframes w1 {
    0%{
        margin-left: 0;
    }
    100%{
        margin-left: -1600px;
    }
}

@keyframes w2 {
    0%{
        margin-left: 0;
    }
    100%{
        margin-left: -1600px;
    }
}

@keyframes desplazamiento {
    0%, 100%{
        transform: translateY(-25px);
    }

    50%{
        transform: translateY(10px);
    }
}
  /*WAVE FINAL*/
