CSS3 Beautiful animation Photo Frame

Put the following into a body inside, run to see:)

<style>*{margin:0; padding:0;}. bg1{background-image:-moz-linear-gradient (45deg,red 25%, transparent 25%,transparent 50%,red 50%, red 75%, transparent 75%, Transparent); background-size:30px 30px;animation:animate 0.5s linear infinite; Transform:opacity 0.3s Ease; height:200px; width:133px; padding:10px; Margin:auto; Position:absolute; top:0; right:0; bottom:0; left:0;} @-webkit-keyframes animate{from{background-position:0    0;} to{background-position:60px 30px}}@-moz-keyframes animate{from{background-position:0    0;} to{background-position:60px 30px}} @keyframes animate{from{background-position:0    0;} to{background-position:60px 30px}}</style><Divclass= "BG1"><imgsrc= "http://c.hiphotos.baidu.com/image/h%3D200/sign=2adf909ea94bd1131bcdb0326aaea488/ 0bd162d9f2d3572cf395e8318e13632763d0c3ec.jpg "alt= "1"width= "133"Height= "$" /></Div>

CSS3 Beautiful animation Photo Frame