#newslist li{float:left;margin-bottom:30px}
#newslist li .border{position:relative}
#newslist li .border .photo{position:relative;z-index:1}
#newslist li .border .photo a{display:block;background-repeat:no-repeat;background-position:50% 50%;background-size:auto 100%;position:relative;transition:all linear .3s;background-size: cover;}
#newslist li .border .photo a:hover{/* background-size:auto 110%; */}
#newslist li .border .photo a:after{content:'';position:absolute;width:100%;height:100%;left:0;top:0;display:block;background:rgba(41,42,55,0.42);z-index:2;transition:all linear .3s}
#newslist li .border .photo a:hover:after{background:rgba(41,42,55,0)}
#newslist li .border .news-info{position:absolute;top:0;left:0;width:100%;overflow:hidden;z-index:3}
#newslist li .border .news-info .news-bottom{border-top:1px solid #a77bb2}
#newslist li .border .news-info .news-bottom p{display:inline-block;background: #1255a9;}
#newslist li .border .news-info .news-bottom p a{color:#fff;font-size:14px;display:block;padding:5px 15px}
#newslist li .border .news-info h3{margin:20px}
#newslist li .border .news-info h3 a{color:#fff;font-weight:400;font-size:17px;line-height:120%;text-shadow:0 0 2px #a77bb2,0 0 2px #000,0 0 2px #000}
@media screen and (min-width: 1367px) {
#newslist li{width: calc((100% - 60px) / 3);}
#newslist li:nth-child(3n-1){margin:0 30px 30px}
}
@media screen and (max-width: 1366px) {
#newslist li{width:calc((100% - 30px) / 2)}
#newslist li:nth-child(odd){margin:0 30px 30px 0}
}
@media screen and (max-width: 640px) {
#newslist li{width:calc((100% - 15px) / 2);margin-bottom:15px}
#newslist li:nth-child(odd){margin:0 15px 15px 0}
}
@media screen and (max-width: 480px) {
#newslist li{width:100%;margin-bottom:15px}
#newslist li:nth-child(odd){margin:0 0 15px}
}