.imgdownlist{list-style:none;margin:0;padding:0;}	
.imgdownlist li{width:25%;text-align:center;float:left;}
.imgdownlist li .imgesdown { align-items: center;  display: flex;  margin: 10px;  position: relative;}
.imgdownlist li img { margin: 0 auto; max-height: 100%; max-width: 100%;  width: 100%;}
.imgdownlist li a {align-items: center;  border: 1px solid #ddd;  border-radius: 3px; box-shadow: 0 0 4px 0 #ddd inset; display: flex;  height: 250px;  padding: 6px;  text-align: center;  width: 100%;}
.imgdownlist li p {align-items: center; background-color: rgba(0, 0, 0, 0.7);  color: #fff;  height: 100%;  justify-content: center;  left: 0;  margin: 0 auto;  position: absolute;  right: 0; display:none;}
.imgdownlist li p span {border: 1px solid #fff;padding:5px 15px;border-radius: 15px / 50%;color:#fff;}
.download span:hover{background-color:#FFF;color:#000;}
.imgesdown:hover .download{display: flex !important;}

@media screen and (min-width:992px) and (max-width:1199px){
	.imgdownlist li a {height: 200px;}
	.imgdownlist li img{max-height:200px;}
}
@media screen and (min-width:767px) and (max-width:991px){
	.imgdownlist li a {height: 150px;}
	.imgdownlist li img{max-height:150px;}
}
@media screen and (max-width:767px){
	.imgdownlist li {width: 50%;}
	.imgdownlist li a {height: 220px;}
	.imgdownlist li img{max-height:220px;}
}
@media screen and (max-width:640px){
	.imgdownlist li {width: 100%;}
	.imgdownlist li a {height: 100%;}
	.imgdownlist li img{max-height:100%;}
}