Happy Birthday Romania!

HTML
<div id='romania'> <div class='flagwave'></div> </div>
CSS
body { background:#FDFDFD; } #romania { margin:150px auto; position: relative; height: 400px; width: 600px; box-shadow: inset 200px 0px 0px blue, inset 400px 0px 0px yellow, inset 600px 0px 0px red; } .flagwave { position: absolute; top: 0px; left: 0px; width: 600px; height: 400px; z-index: 2; background-image: -webkit-gradient( linear, 0% 30%, 50% top, color-stop(0%,rgba(204,99,40,0)), color-stop(40%,rgba(204,99,40,0)), color-stop(90%,rgba(204,99,40,.3)), color-stop(100%,rgba(204,99,40,0))), -webkit-gradient( linear, 50% 30%, 100% top, color-stop(0%,rgba(204,99,40,0)), color-stop(25%,rgba(204,99,40,.3)), color-stop(50%,rgba(204,99,40,0)), color-stop(80%,rgba(204,99,40,.3)), color-stop(100%,rgba(204,99,40,0))); background-size: 200%; background-position: right; -webkit-animation-name: flagwave; -webkit-animation-duration: 10s; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; } @-webkit-keyframes flagwave { 0% { background-position: -400px 0px, -400px 0px, -400px 0px,-400px 0px; } 100% { background-position: 800px 0px, 800px 0px, 800px 0px, 800px 0px; } }
JAVASCRIPT
Expand for more options Login