* { margin: 0; padding: 0; }
.box { width: 1200px; height: 220px; margin: 50px auto; }
.box ul li { float: left; width: 145px; height: 145px; background: #ffffff; border: solid 5px #d9d9d8; margin: 5px; list-style: none; position: relative; overflow: hidden; }
.box ul li .cover a { width: 80px; height: 30px; background: #ffffff; display: block; line-height: 30px;color: #990000; margin: 30px auto;border: solid 2px #d9d7d7; font-size:18px }
.box ul li .cover a i { color: red; }
.box ul li .cover { width: 145px; height: 145px; background:url(../images/tmbj.png); position: absolute; left: 0; top: 0; text-align: center; color: #6b6b6b; transform-origin: right bottom; -webkit-transform-origin: right bottom; -moz-transform-origin: right bottom; transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); transition: all 0.35s; -webkit-transition: all 0.35s; -moz-transition: all 0.35s; }
.box ul li .cover p { margin-top: 10px; font-size: 14px; }
.box ul li:hover .cover { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); }