.imagelist{overflow:hidden; background:; }
.imagelist .list-box{text-align:center;}
.imagelist .list-box ul:after{display:block; content:''; clear:both;}
.imagelist .list-box ul li{float:left;margin-bottom:20px;}
.imagelist .list-box ul li a{display:block; transition:.6s; position:relative; overflow:hidden;}
.imagelist .list-box ul li a span{display:block; overflow:hidden;}
.imagelist .list-box ul li a span img{display:block; width:100%; height:245px;transition:.6s;}
.imagelist .list-box ul li a:hover span img{transform:scale(1.05);} 
.imagelist .list-box ul li a h4{position:absolute; bottom:0; left:0; right:0; z-index:2; color:#fff;padding:12px 8px; text-align:center; transform:translateY(101%); transition:.6s;border-top: 1px solid #fff;background:rgb(250,194,25); }
.imagelist .list-box ul li a:hover h4{transform:translateY(0);}
@media(min-width:992px){
.imagelist{padding-top:22px; padding-bottom:28px;margin-left: 260px;}
.imagelist .list-box{margin-bottom:18px;}
.imagelist .list-box ul li{width:31%;;margin-left:1%;margin-right:1%;}
}
@media(max-width:991px){
.imagelist{padding-top:18px; padding-bottom:18px;margin-left: 0;}
.imagelist .list-box{margin-bottom:8px;}
.imagelist .list-box ul li{width:50%;}
}
@media(min-width:768px){
.imagelist .list-box ul{margin:0 -8px;}
.imagelist .list-box ul li{padding:8px;}
.imagelist .list-box ul li a h4{padding:8px;}
}
@media(max-width:767px){
.imagelist .list-box ul{margin:0 -4px;}
.imagelist .list-box ul li{padding:4px;}
.imagelist .list-box ul li a h4{padding:4px;}
}