JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr>
        <td align="middle">
            <div id="wrapper" style="display: inline-block; ">
                <div id="center">
                    <div id="barra">
                        <img src="http://s14.postimg.org/d7fi1n4ch/logo_a.jpg">
                    </div>
                    <div id="logo">
                        <img src="http://s14.postimg.org/paktp7fep/barra_a.jpg">
                    </div>
                </div>
            </div>
        </td>
    </tr>
</table>

CSS

div#barra {
    position:absolute;
    -webkit-animation:bounce 4s infinite alternate;
    -moz-animation:bounce 4s infinite alternate;
    -ms-animation:bounce 4s infinite alternate;
    -o-animation:bounce 4s infinite alternate;
    animation:bounce 4s infinite alternate;


}
@-webkit-keyframes bounce {
    from {
        clip: rect(0px, 0px, 150px, 0px);
    }
    to {
        clip: rect(0px, 575px, 150px, 0px);
    }
}
@-moz-keyframes bounce {
    from {
        clip: rect(0px, 0px, 150px, 0px);
    }
    to {
        clip: rect(0px, 575px, 150px, 0px);
    }
}
@-o-keyframes bounce {
    from {
        clip: rect(0px, 0px, 150px, 0px);
    }
    to {
        clip: rect(0px, 575px, 150px, 0px);
    }
}
@keyframes bounce {
    0% {
        clip: rect(0px, 0px, 150px, 0px);
    }
    100% {
        clip: rect(0px, 575px, 150px, 0px);
    }
}
html, body {
    height:100%;
    background-color: #ffffff;
}
body {
    margin:0;
    padding:0;
    overflow:hidden;
}
table {
    width:100%;
    height:100%;
}
#center {
    width:100%;
    height:50%;
    position: relative;
}