﻿.qcontainer{-webkit-perspective:400;-moz-perspective:400;float:left;width:360px;margin-right:20px;}
.film{width:100%;height:300px;-webkit-transform-style:preserve-3d;-webkit-transition:1.5s;-moz-transform-style:preserve-3d;-moz-transition:1.5s;}
.qcontainer:hover .film{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);}
.face{position:absolute;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden; width:360px; height:270px; overflow:hidden;}
.front img{ width:360px; height:auto;}
.face h3{color:white;text-align:center; font-size:18px; line-height:270px; color:#fff;}
.back{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);background:-webkit-gradient(linear,left top,left bottom,from(#e1472f ),to(#e1472f ));background:-moz-linear-gradient(top,#e1472f ,#e1472f );width:360px;height:270px;}
.foot{text-align:center;color:#fff;position:fixed;bottom:0px;left:0%;margin-left:-126px;font-size:12px;font-family:"黑体"；}


.qcontainer1{-webkit-perspective:400;-moz-perspective:400;float:left;width:360px;margin-right:20px;}
.film1{width:100%;height:300px;-webkit-transform-style:preserve-3d;-webkit-transition:1.5s;-moz-transform-style:preserve-3d;-moz-transition:1.5s;}
.qcontainer1:hover .film1{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);}
.face1{position:absolute;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden; width:360px; height:270px; overflow:hidden;}
.front1 img{ width:360px; height:auto;}
.face1 h3{color:white;text-align:center; font-size:18px; line-height:270px; color:#fff;}
.back1{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);background:-webkit-gradient(linear,left top,left bottom,from(#e1472f ),to(#e1472f ));background:-moz-linear-gradient(top,#e1472f ,#e1472f );width:360px;height:270px;}
.foot{text-align:center;color:#fff;position:fixed;bottom:0px;left:0%;margin-left:-126px;font-size:12px;font-family:"黑体";}



.kzk2 ul li{float:left;margin:0px 30px 30px 0;position:relative;list-style:none}
.kzk2 ul li.last{ margin-right:0px;}
.kzk2 ul li{ -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; width:360px; height:auto; overflow:hidden;}
.kzk2 ul li img{width:360px;height:270px;border-radius: 2px;}
.kzk2 ul li:hover { transform:rotate(360deg);-webkit-transform:rotate(360deg); -moz-transform:rotate(360deg); -o-transform:rotate(360deg);  -ms-transform:rotate(360deg);}