#headerOfertas {
    position: relative;
    width: 100%;
    height: 10vh;
    background: #14328300 !important;
    overflow: hidden;
}


section .nav {
    position: absolute;
    z-index: 1;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px;
    background: url('../img/wave.png') repeat-x;
    transform: rotate(180deg);
    background-size: 1000px 100px;
}

section .head {
    position: absolute;
    z-index: 2;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px;
    background: url('../img/ola.png') repeat-x;
    transform: rotate(180deg);
    background-size: 1000px 100px;
}

.nav1 {
    animation: nav1 15s linear infinite;
    z-index: 1000;
    opacity: 1;
}

.nav2 {
    animation: nav2 7s linear infinite;
    z-index: 999;
    opacity: 0.5;
    bottom: 10px;
}

.head1 {
    animation: head1 9s linear infinite;
    z-index: 997;
    opacity: 0.7;
    animation-delay: -5s;
    bottom: 20px;
}


@keyframes nav1 {
    from {
        background-position-x: 0;
    }

    to {
        background-position-x: 1000px;
    }
}

@keyframes nav2 {
    from {
        background-position-x: 0;
    }

    to {
        background-position-x: -1000px;
    }
}

@keyframes head1 {
    from {
        background-position-x: 0;
    }

    to {
        background-position-x: -1000px;
    }
}

@media (max-width: 768px) {

    #headerOfertas {
        position: relative;
        width: 100%;
        height: 7vh;
        background: #14328300 !important;
        overflow: hidden;
        /* border: solid 1px red; */

    }

    section .nav {
        position: absolute;
        z-index: 1;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 60px !important;
        background: url('../img/wave.png') repeat-x;
        transform: rotate(180deg);
        background-size: 1000px 100px;
    }

    section .head {
        position: absolute;
        z-index: 2;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 60px !important;
        background: url('../img/ola.png') repeat-x;
        transform: rotate(180deg);
        background-size: 1000px 100px;
    }
}