﻿main{padding:100px 0 90px;position:relative;overflow:hidden}

@-webkit-keyframes pulse{0%{opacity:.05}50%{opacity:.2}100%{opacity:.05}}
@keyframes pulse{0%{opacity:.05}50%{opacity:.2}100%{opacity:.05}}
.archive-page .entery:before{position: absolute;top:0;right:0;height:100%;width:100%;z-index:1000}
body.loading-ent .archive-page .entery:before{content:""}
body.loading-ent .archive-page .entery{-webkit-animation:pulse 1s linear infinite;animation:pulse 1s linear infinite;opacity:.2}
body.loading-ent .rt-loading{display:block;width:100px;height:140px;top:calc(50% - 70px);right:calc(50% - 50px);background:none}

.archive-page .entery{margin-top:5px}
.archive-page .entery.arcx{margin-bottom:20px}
.archive-page .entery .mini-p{width:calc(14.28% - 30px);margin:20px 15px}
.archive-page .entery .mini-list{width:calc(25% - 20px);margin:10px}


.rt-bgx{top:0;right:0;z-index:-1;max-height:600px}
.rt-bgx img{z-index:-1;opacity:.2}
.rt-bgx::before{content:"";position:absolute;bottom:-2px;right:0;height:100%;background:linear-gradient(to bottom, transparent, #171c24);width:100%;float:right}
.light-mode .rt-bgx::before{background:linear-gradient(to bottom, transparent, #f2f2f2);}


@media only screen and (max-width:1190px){
.archive-page .entery .mini-p{width:calc(16.66% - 30px)}
.archive-page .entery .mini-list{width:calc(33.33% - 20px)}
}
@media only screen and (max-width:1020px){
.archive-page .entery .mini-p{width:calc(20% - 30px)}
}
@media only screen and (max-width:920px){
main{padding:70px 0 80px}
.archive-page .entery{margin-top:0}
.rt-bgx{top:59px}
}
@media only screen and (max-width:840px){
.archive-page .entery .mini-p{width:calc(25% - 30px)}
.archive-page .entery .mini-list{width:calc(50% - 20px)}
}
@media only screen and (max-width:670px){
.archive-page .entery .mini-p{width:calc(33.33% - 30px)}
}
@media only screen and (max-width:670px){
.archive-page .entery .mini-p{width:calc(33.33% - 20px);margin:10px}
}
@media only screen and (max-width:560px){
.archive-page .entery .mini-list{width:100%;margin:0 0 15px}
}
@media only screen and (max-width:490px){
.mini-p .pic{height:190px}
}
@media only screen and (max-width:450px){
.mini-p .pic{height:160px}
}
@media only screen and (max-width:410px){
.archive-page .entery .mini-p{width:calc(50% - 20px)}
.mini-p .pic{height:220px}
}
@media only screen and (max-width:370px){
.mini-p .pic{height:200px}
}