@charset "utf-8";

/* CSS Document */

body,figure,figcaption,h2,p{margin:0;padding:0;}

figure{position:relative;width:33.33%;height:350px;overflow:hidden;float:left;}

figcaption{position:absolute;top:0px;left:0px;color:#ccc;font-family:"微软雅黑";}

figure img{opacity:0.8;transition:all 0.35s;}/*图片虚化*/

figure figcaption p,h2,span,div{transition:all 0.35s;}

@media screen and (min-width:1001px){

figure{ width:33.33%;}

}

@media screen and (max-width:600px){

figure{ width:100%;}

}

@media screen and (min-width:601px) and (max-width:1000px){

figure{ width:50%;}

}

.test1{background:#2F0000;}

.test1 figcaption p{background:#fff;color:#333;margin:5px;text-align:center;transform:translate(-120px,0px);}

.test1 figcaption p:nth-of-type(1){transition-delay:0.05s;}

.test1 figcaption p:nth-of-type(2){transition-delay:0.1s;}

.test1 figcaption p:nth-of-type(3){transition-delay:0.15s;}

.test1 figcaption{padding:20px;}

.test1:hover figcaption p{transform:translate(0px,0px);}

.text1:hover img{transform:translate(-50px,0px);opacity:0.2;}