﻿.top-recs .entery a{margin:10px;background-color:#000}
.top-recs .entery a .bg{object-position:left}
.top-recs .entery a .dooble{right:0;top:0;border-radius:15px 10px 0 15px;background-color:#10a837;padding:3px 10px}
.top-recs .entery a .dooble.sub{background-color:#ff9800}
.top-recs .entery a .dooble i{margin:2px 0 0 7px}
.top-recs .entery a .titr{text-shadow:1px 1px 1px rgba(0, 0, 0, 0.8);letter-spacing:1px;bottom:15px;right:25px;width:calc(100% - 50px)}
.top-recs .entery a.series-type:before,.top-recs .entery a.series-type:after{background-color:#fff;position:absolute;height:3px;content:"";transform:translateX(50%);right:50%;border-radius:3px}
.top-recs .entery a.series-type:before{top:-5px;width:90%;opacity:.2}
.top-recs .entery a.series-type:after{top:-10px;width:80%;opacity:.1}
.top-recs .entery a.series-type:hover:before,.top-recs .entery a.series-type:hover:after{top:0;opacity:0}
.top-recs .entery a .hover{height:100%;top:0;right:0;background-color:rgba(0, 0, 0, 0.7);padding:20px;opacity:0;z-index:101}
.top-recs .entery a .hover .name{margin-top:13px;letter-spacing:1px}
.top-recs .entery a .hover .name span{letter-spacing:0;margin:0 2px}
.top-recs .entery a .hover .imdb{color:#dfb31d;margin-top:8px}
.top-recs .entery a .hover .imdb i{transform:translate(10px,5px)}
.top-recs .entery a .hover .imdb .rt-13{letter-spacing:2px}
.top-recs .entery a:hover .hover{opacity:1;backdrop-filter:blur(3px)}
.top-recs .entery a:hover .titr,.top-recs .entery a:hover .dooble{opacity:0}
.top-recs .entery a.dooble .titr,.top-recs .entery a.dooble .hover .name{font-family:yekan;letter-spacing:0}
.top-recs .entery a.dooble .hover .name span{font-family:yekan}

@media only screen and (min-width:920px){
.top-recs .entery a:nth-child(1) .titr{bottom:20px}
.top-recs .entery a:nth-child(2) .bg,.top-recs .entery a:nth-child(3) .bg,.top-recs .entery a:nth-child(4) .pic,.top-recs .entery a:nth-child(5) .pic,.top-recs .entery a:nth-child(1) .pic{display:none}
.top-recs .entery a:nth-child(2),.top-recs .entery a:nth-child(3){width:calc(16% - 20px)}
.top-recs .entery a:nth-child(1){width:calc(38% - 20px)}
.top-recs .entery a:nth-child(4),.top-recs .entery a:nth-child(5){width:calc(30% - 20px)}
.top-recs .entery a:nth-child(2) .pic,.top-recs .entery a:nth-child(1) .bg,.top-recs .entery a:nth-child(3) .pic{height:300px}
.top-recs .entery a:nth-child(4) .bg,.top-recs .entery a:nth-child(5) .bg{height:142.5px}
.top-recs .entery a:nth-child(1) .hover .fa-play-circle{font-size:43px;margin-bottom:8px}
.top-recs .entery a:nth-child(4) .imdb,.top-recs .entery a:nth-child(5) .imdb{margin-top:0}
.top-recs .entery a:nth-child(2) .titr,.top-recs .entery a:nth-child(3) .titr{font-size:16px}
}
@media only screen and (min-width:1400px){
.top-recs .entery a:nth-child(4) .bg,.top-recs .entery a:nth-child(5) .bg{height:162.5px}
.top-recs .entery a:nth-child(2) .pic,.top-recs .entery a:nth-child(1) .bg,.top-recs .entery a:nth-child(3) .pic{height:340px}
}



@media only screen and (max-width:920px){
.top-recs .entery a .pic,.top-recs .entery a .hover{display:none}
.top-recs .entery a .bg{height:100px}
.top-recs .entery a{width:150px;margin:10px 0 0 15px}
.top-recs .entery a .titr{font-size:14px;right:15px;bottom:15px;width:calc(100% -  30px)}
}