/* 
 * @name: index.css
 * @time: 2013/1/21
 * @author: sole
 * @url: http://www.imsole.net/
 * @directiona: 首页样式，包括：项目列表
*/

/* project */
.project { margin-top:10px; font-family:"Microsoft YaHei"; }
.project-list { width:960px; overflow:hidden; }
.project-list a { cursor: pointer; }
.project-list .item-0 { float:left; width:230px; padding-right:10px; }
.project-list .item-1 { float:left; width:480px; padding-right:10px;}
.project-list .item-2 { float:right; width:230px; }
.project-list .item-3 { float:left; width:230px; }
.project-list .item-4 { float:right; width:480px; }

.project-list .icon { position:relative; display:block; width:230px; height:130px; margin-bottom:10px; text-decoration:none; text-align:center; color:#fff; }
.project-list .icon:hover { opacity:.8; filter:alpha(opacity=80); transition:all .25s ease 0s; }
.project-list .icon i { display:inline-block; width:70px; height:60px; margin-top:35px; background-image:url(../img/icon_bg.png); }
.project-list .icon-2 i,
.project-list .icon-9 i { margin-left:-100px; }
.project-list .icon-9 i { margin-left:-140px; }
.project-list .icon-10 i,
.project-list .icon-11 i,
.project-list .icon-12 i { width:56px; height:32px; }
.project-list .icon em { position:absolute; left:10px; bottom:5px; font-size:20px; }
.project-list .icon-2 em,
.project-list .icon-9 em { left:240px; top:105px; line-height:120%; font-size:45px; }
.project-list .icon-9 em { left:200px; }
.project-list .icon .arrow { position:absolute; top:10px; right:10px; width:50px; height:50px; background:url(../img/arrow.png) no-repeat; display:none; }
.project-list .icon:hover .arrow { display:block; }
.project-list .icon-7 span { position:relative; float:left; width:76px; height:130px; border-right:1px solid #fff; }
.project-list .icon-7 .icon-12,
.project-list .icon-7 .arrow { border-right:none; }
.project-list .icon-7 .samll { display:none; }
.project-list .icon-7 .samll .arrow { width:34px; height:34px; background:url(../img/arrowx.png) no-repeat; }
.project-list .icon-7 .def,
.project-list .icon-7 .def .icon-10 { width:230px; height:130px; border:none; }
.project-list .icon-7:hover .samll { display:block; }
.project-list .icon-7:hover .def { display:none; }

.project-list .icon-2,
.project-list .icon-9 { width:480px; height:270px; }
.project-list .icon-0 { background-color:#3098cb; }
.project-list .icon-1 { background-color:#f1b244; }
.project-list .icon-2 { background-color:#f16798; }
.project-list .icon-3 { background-color:#4bb1d6; }
.project-list .icon-4 { background-color:#e1477d; }
.project-list .icon-5 { background-color:#046a9c; }
.project-list .icon-6 { background-color:#d94a7c; }
.project-list .icon-7 { background-color:#f1b244; }
.project-list .icon-8 { background-color:#4bb1d6; }
.project-list .icon-9 { background-color:#d22a65; }

.project-list .icon-2 i,
.project-list .icon-9 i { margin-top:105px; }
.project-list .icon-0 i { background-position:0 0; }
.project-list .icon-1 i { background-position:0 -300px; }
.project-list .icon-2 i { background-position:0 -240px; }
.project-list .icon-3 i { background-position:0 -360px; }
.project-list .icon-4 i { background-position:0 -420px; }
.project-list .icon-5 i { background-position:0 -480px; }
.project-list .icon-6 i { background-position:0 -60px; }
.project-list .icon-7 i { background-position:0 -120px; }
.project-list .icon-8 i { background-position:0 -120px; }
.project-list .icon-9 i { background-position:0 -180px; }
.project-list .icon-10 i { background-position:-60px -445px; }
.project-list .icon-11 i { background-position:-60px -484px; }
.project-list .icon-12 i { background-position:-60px -530px; }