/*********************** Demo - 8 *******************/
.box8 .icon,.box8 .title{margin:0;position:absolute}
.box8{box-shadow:0 0 3px rgba(0,0,0,.3);position:relative}
.box8 img{width:100%;height:auto}
.box8 .box-content{width:100%;height:100%;background:rgba(0,0,0,.6);opacity:0;position:absolute;top:0;left:0;transform:perspective(400px) rotateX(-90deg);transform-origin:center top 0;transition:all .5s ease 0s}
.box8 .icon li a,.box8 .title{background:#ef4050;font-size:20px;color:#fff}
.box8:hover .box-content{opacity:1;transform:perspective(400px) rotateX(0)}
.box8 .title{padding:5px 7px;border-radius:5px;font-weight:600;bottom:20px;left:20px;transition:all .9s ease 0s}
.box8 .icon li a,.box9 .box-content,.box9 .icon li,.box9 img{transition:all .35s ease 0s}
.box8 .post{display:block;font-size:15px;font-weight:600;color:#fff;margin-top:10%}
.box8:hover .title{bottom:-40px}
.box8 .icon{list-style:none;padding:0;top:42%;left:0;right:0}
.box8 .icon li a{display:block;width:40px;height:40px;line-height:40px;border-radius:50%;margin-right:7px}
.box9 .icon,.box9 .title{width:100%;font-size:22px}
.box8 .icon li a:hover{background:#fff;color:#000}
@media only screen and (max-width:990px){.box8{margin-bottom:20px}
}