@font-face{font-family:'WebSymbolsRegular';src:url('websymbols/websymbols-regular-webfont.eot');src:url('websymbols/websymbols-regular-webfont.eot?#iefix') format('embedded-opentype'), url('websymbols/websymbols-regular-webfont.woff') format('woff'), url('websymbols/websymbols-regular-webfont.ttf') format('truetype'), url('websymbols/websymbols-regular-webfont.svg#WebSymbolsRegular') format('svg');font-weight:normal;font-style:normal} .ca-menu{padding:0 0 0 48px;margin:20px auto;width:1020px} .ca-menu li{width:230px;height:230px;border:10px solid #f6f6f6;overflow:hidden;position:relative;float:left;background:#FF1F1F;margin-left:-48px;-webkit-box-shadow:1px 1px 2px rgba(0,0,0,0.2);-moz-box-shadow:1px 1px 2px rgba(0,0,0,0.2);box-shadow:1px 1px 2px rgba(0,0,0,0.2);-webkit-border-radius:125px;-moz-border-radius:125px;border-radius:125px;-webkit-transition:all 400ms linear;-moz-transition:all 400ms linear;-o-transition:all 400ms linear;-ms-transition:all 400ms linear;transition:all 400ms linear} .ca-menu li:last-child{margin-right:0px} .ca-menu li a{text-align:left;width:100%;height:100%;display:block;color:#333;position:relative} .ca-icon{font-family:'WebSymbolsRegular', cursive;font-size:40px;color:#f6f6f6;;line-height:60px;position:absolute;width:100%;height:60px;left:0px;top:30px;text-align:center;-webkit-transition:all 400ms linear;-moz-transition:all 400ms linear;-o-transition:all 400ms linear;-ms-transition:all 400ms linear;transition:all 400ms linear} .ca-main{font-size:24px;position:absolute;top:110px;height:80px;width:170px;left:50%;margin-left:-85px;opacity:0.8;text-align:center;color:#555} .ca-sub{display:none} .ca-menu li:hover{border-color:#333;z-index:999;-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)} .ca-menu li:hover .ca-icon{color:#000;font-size:60px;text-shadow:0px 0px 1px #000;-webkit-animation:moveFromBottom 300ms ease;-moz-animation:moveFromBottom 300ms ease;-ms-animation:moveFromBottom 300ms ease} .ca-menu li:hover .ca-main{color:#000;-webkit-animation:moveFromBottom 500ms ease;-moz-animation:moveFromBottom 500ms ease;-ms-animation:moveFromBottom 500ms ease} @-webkit-keyframes moveFromBottom{from{-webkit-transform:translateY(200%) scale(0.5);opacity:0} to{-webkit-transform:translateY(0%) scale(1);opacity:1}} @-moz-keyframes moveFromBottom{from{-moz-transform:translateY(200%) scale(0.5);opacity:0} to{-moz-transform:translateY(0%) scale(1);opacity:1}} @-ms-keyframes moveFromBottom{from{-ms-transform:translateY(200%) scale(0.5);opacity:0} to{-ms-transform:translateY(0%) scale(1);opacity:1}}