/* category */
.wrapper-movie{ background: #ffffff; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); display: inline-block; width: 45%; padding: 10px 10px; margin: 10px 8px; vertical-align: top; height: 240px;}
.movie-cat-info{ vertical-align: top; margin-top: -20px; height: 15px; background: #ffffff; color: #777777;}
.movie-cat-info a:hover{ text-decoration: underline;}
.movie-cat-info div{ display: inline-block; margin-left: 5px;}
.video-hd{ display: none !important;}

.cat-mc-info{ float: right; background: #f8f8f8; padding: 2px 2px; margin: 0 1px; border: 1px solid #cccccc; border-radius: 3px;}
.cat-mc-info:hover i{ color: #666666; }
.cat-mc-info:hover a{ color: #666666; }
.cat-mc-info a{ color: #777777; text-decoration: none; line-height: 16px;}
.cat-mc-info a i{ color: #777777; vertical-align: bottom; line-height: 16px;}
.cat-mc-info a:hover{ color: #666666; text-decoration: none; }
.cat-mc-info:hover{ background: #E2E2E2; }

/* topcat countcat */

.z-topcat #wrapper-cat{ margin: 0; padding: 0; background: none;}
.z-countcat #wrapper-cat{ margin: 0; padding: 0px 0px; background: none; }

.z-topcat #wrapper-cat .first, .z-countcat #wrapper-cat{ margin-top: 5px;}
.z-topcat .top-movie, .z-countcat .top-movie{ height: auto; padding: 5px; background: #ffffff; position: relative; margin: 10px 0px;}
.z-topcat .top-movie:before, .z-countcat .top-movie:before{content: ""; position: absolute; left: 15px; bottom: 0; height: 1px; width: 96%; border-bottom: 1px solid #DDD;}
.z-topcat .top-movie .position, .z-countcat .top-movie .position{ float: left; width: 30px; text-align: center; font-size: 16px; color: #333; font-weight: bold;}
.z-topcat .top-movie .content, .z-countcat .top-movie .content{ margin-left: 40px; margin-right: 120px; border-right: 1px solid #DDD;}
.z-topcat .top-movie .content .movie-card, .z-countcat .top-movie .content .movie-card{ margin-right: 5px;}
.z-topcat .top-movie .content .mc-cast, .z-countcat .top-movie .content .mc-cast{ margin-right: 5px; line-height: 1.6em;}
.z-topcat .top-movie .data, .z-countcat .top-movie .data {position: absolute; top: 50px; right: 5px; width: 100px; vertical-align: top; text-align: center; padding: 0; background: none;}
.z-topcat .top-movie .data .avg-rating, .z-countcat .top-movie .data .avg-rating{ text-align:center; color:#FFFFFF; letter-spacing: -1px; width:2em; margin: 0 auto; border-radius: .3em; box-sizing: border-box; border:1px solid #447CAD; font-weight: normal; font-size: 24px;}
.z-topcat .top-movie .data .rat-count, .z-countcat .top-movie .data .rat-count{ padding: 2px 0px; margin-top: 5px; font-size: 12px;}

/* catbygenre */
.z-catbygenre .catbygenre .top-anchors {text-align: center; margin: 20px 0;}
.z-catbygenre .catbygenre .page-content {margin: 10px;}
.z-catbygenre .catbygenre .wrapper { padding: 1px; margin-bottom: 50px; position: relative; background: none;}
.z-catbygenre .catbygenre .wrapper .left-bar {position: absolute; top: 0; bottom: 0; width: 15px;}
.z-catbygenre .catbygenre .wrapper .content {margin: 0 10px 0 25px;}
.z-catbygenre .catbygenre .wrapper .content .title {font-size:16px; font-weight: bold; margin: 5px;}
.z-catbygenre .catbygenre .wrapper .content ul {list-style: none; margin: 0; padding: 0;}
.z-catbygenre .catbygenre .wrapper .content ul > li {margin: 10px 0; background: #FFF; padding: 10px; position: relative; }
.z-catbygenre .catbygenre .wrapper .content ul li:before{content: ""; position: absolute; left: 35px; bottom: 0; height: 1px; width: 90%; border-bottom: 1px solid #DDD;}
.go-up{float: right; background: #F5F5F5; font-size: 11px; padding: 1px 3px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);}

/* rdcat */
.z-rdcat #main-wrapper-rdcat{ margin: 0px 10px 50px 10px; padding: 5px; }
.z-rdcat .padding-list{ background: #FFFFFF; padding: 5px 5px 15px 5px; margin: 10px 5px !important; position: relative;}
.z-rdcat .padding-list:before{ content: ""; position: absolute; left: 35px; bottom: 0; height: 1px; width: 90%; border-bottom: 1px solid #DDD; }
.z-rdcat .rdate-cat{ margin: 5px 2px 0 5px; font-size: 18px; background: #557CAD; padding: 5px; color: #FFF;}
.z-rdcat .rdate-cat-first{ margin: 0px 2px 0 5px; font-size: 18px; color: #FFF; }
.z-rdcat .rdate-cat-first i{ vertical-align: text-top; color: #FFF; }
.z-rdcat .rdate-cat i{ vertical-align: text-top; color: #FFF; }

/* reccat */
.z-reccat #wrapper-cat{ background: #fff;}
.z-reccat #rc-movies{ margin-top: 10px;}
.z-reccat .mcard{ background: #FFFFFF; padding: 5px 5px 10px 5px; margin: 10px 5px; position: relative;}
.z-reccat .mcard:before{content: ""; position: absolute; left: 35px; bottom: 0; height: 1px; width: 90%; border-bottom: 1px solid #DDD;}
.mcard .movie-card-item{ margin-right: 100px;}
.data{ position:absolute; right: 5px; top: 15px; width: 80px; background: #447CAD; color: #fff; text-align: center; padding: 4px;}
.data .avg{ font-size: 22px; line-height: 38px; font-weight: bold;}
.data .count{ font-size: 12px; line-height: 24px;}

.no-rec-info{ margin: 40px 12px; text-align: center; color: #444444; font-weight: bold;}
.rec-info{ margin: 12px; text-align: right; color: #999999; font-weight: bold; font-style: italic;}

/* smsrec*/
.sms-rec-movie-wrapper{ background: #FFFFFF; position: relative; margin: 0 10px; padding: 25px 0px; display: flex; justify-content: end; align-items: stretch; border-bottom: 1px solid #CCC;}
.sms-rec-movie-wrapper .sms-rec-movie-item{ margin-right: 15px; width: 100%;}
.sms-rec-movie-wrapper .sms-rec-movie-rat{ background: #447CAD; width: 120px;  padding: 5px 0px; text-align: center; }
.sms-rec-movie-wrapper .sms-rec-movie-rat .wrat{ padding-top: 20px;}
.sms-rec-movie-wrapper .sms-rec-movie-rating-box {margin-left: 5px;}
.sms-rec-movie-wrapper .sms-rec-movie-rating-box .rate-movie-box{ margin-top: 0;}
.sms-rec-movie-wrapper .sms-rec-movie-rating-box > .addtobl {display: flex; align-items: center; justify-content: center; border: 1px solid #CCC; padding: 5px; width: 160px; box-sizing: border-box; border-radius: 5px;}
.sms-rec-movie-wrapper .sms-rec-movie-rating-box > .addtobl:hover {background: #EEE;}
.sms-rec-movie-wrapper .sms-rec-movie-rating-box > .addtobl i {font-size: 18px; margin: 0 5px;}

/* proreviews-cat */
.pro-reviews-cat-wrapper{
    .top-movie{
        .stats{ display:none}
        .pro-reviews-chart{ 
            display: flex;
            .title{
                display: none;
            }
            .body{
                .pro-reviews-chart-wrapper{ 
                    display: flex; flex-direction: column;
                    width: 100px; height: 75px; margin-left: auto; margin-right: auto; padding: 0px; position: relative; 
                    .legend-wrapper{ 
                        color: var(--bs-secondary-color); text-align: right; margin-right: 10px; margin-top: 80px; text-align: center;
                        .leg{ 
                            margin-bottom: 6px;
                            i{ 
                                font-size: 10px; color: inherit ;
                            }
                        }
                    }
                    .total-abs{ 
                        position: absolute; font-size: 22px; width: 90px; height: 70px; line-height: 70px; color: var(--bs-secondary-color); text-align: center; left: -4px;
                        small{ 
                            position: absolute; font-size: 12px; top: 2px;
                            i{ 
                                color: inherit; 
                            }
                        }
                    }
                }
            } 
            .mc-flex.movie-card-22{
                .pos{  
                    margin-top: 0px; width: auto; height: auto; line-height: unset;
                }
            } 
        }
    } 
}

/* new rdcat */
.calendar-wrapper.mx-2{
    display: flex; flex-wrap: wrap; position: relative;
    > div{ flex-grow: 1; width: 33%; } 
    #button-prev{
        position: absolute; top: 4px; left: 5px; width: 25px; height: 25px; cursor: pointer;
        i{ font-size: 20px;}
    }
    #button-next{ 
        position: absolute; top: 4px; right: 15px; width: 25px; height: 25px; cursor: pointer;
        i{ font-size: 20px;}
    }
    #calendar{
        .zabuto-calendar{
            tbody{
                .zabuto-calendar__day--today{ 
                    background-color: var(--bs-primary); color: var(--bs-white); font-weight: bold;
                }
            } 
        } 
    }
    .zabuto-calendar{
        margin-right: 10px; 
        thead{ 
            background-color: var(--bs-secondary-bg);
            tr{ 
                height: 28px;
            }
        }
        tbody{
            td, tr, th, tfoot {
                height: 20px;
            }
            td[class*="zabuto-calendar__event actual-"]{ 
                background-color: var(--bs-yellow); color: var(--bs-dark); cursor: pointer; font-weight: bold;
            }
            td[class*="zabuto-calendar__event pn-"]{ 
                background-color: var(--bs-secondary); color: var(--bs-dark); cursor: pointer; font-weight: bold;
            }
        } 
        .zabuto-calendar__days-of-week{
            background-color: var(--bs-tertiary-bg)
        }
    }
}

.newcat-legend.mx-2{
    .legend{ 
        margin: 10px 0px 0px 0px; padding: 0px;
        li{ 
            display: inline-flex; margin-right: 5px; font-size: 10px; align-items: center; justify-content: center;
            .square{
                width: 10px; height: 10px; border: 1px solid #777; margin-right: 3px;
            }
            .today-square{ 
                background: var(--bs-primary);
            }
            .next-cat-square{ 
                background: var(--bs-secondary);
            }
            .actual-cat-square{ 
                background: var(--bs-yellow);
            }            
        }
    }
} 

/* myvotes */
.ratdate{ background: none repeat scroll 0 0 #f2f2f2; margin: 10px 10px 15px 10px; padding: 5px;}
.date-header{ color: #333333; font-size: 16px; margin: 5px 2px 0 5px; padding: 1px;}

.reset-class{ background: #FFFFFF !important; margin: 0px !important; padding: 0px !important;}

.my-votes-wrapper{ background: none repeat scroll 0 0 #f2f2f2; margin: 10px; padding: 5px; }
.my-votes-wrapper .my-votes-movie-wrapper{ margin: 10px; padding: 10px; position: relative; background: #FFFFFF;}
.my-votes-wrapper .my-votes-movie-wrapper .my-votes-movie-item{ margin-right: 170px;}
.my-votes-wrapper .my-votes-movie-wrapper .my-votes-rating-box{ position: absolute; top: 0; right:0; }

/* all_films*/

#all-films-wrapper{ background: none repeat scroll 0 0 #f2f2f2; margin: 5px 10px; padding: 5px;}
#all-films-wrapper .all-films-movie{ background: #FFFFFF; margin: 10px 5px; padding: 5px;}

/* topgen */
ul#top-movies { list-style: none; background: none repeat scroll 0 0 #f2f2f2; margin: 0px; padding: 0px;}
#top-movies > li{ background: #FFFFFF; margin: 0px;}
#top-movies > li > ul {list-style: none; padding: 15px 0px; margin-bottom: 0; position: relative;}
#top-movies > li > ul:before { content : ""; position: absolute; left: 35px; bottom: 0; height: 1px; width: 80%; border-bottom: 1px solid #DDD; }
#top-movies .position { display: inline-block; vertical-align: top; width: 30px; text-align: center; font-size: 16px; color: #777; margin-left: 3px;}
#top-movies .content { display: inline-block; width: 650px;}
#top-movies .data {display: inline-block; width: 70px; vertical-align: top; background: none !important; position: static !important; padding: 0px !important;}

#top-movies .avg-rating {margin: 4px auto;}
#top-movies .rat-count {text-align: center;}

#load-more-div {text-align: center;margin-top: 20px;}
#head-topg{ text-align:center; margin: 5px 2px;}
#info-topg{ margin: 3px; padding: 3px 0px;}

.filter {position: relative; display: none;}

/* userratings */
.user-ratings-info-top{ text-align: right; padding-top: 5px;}
.user-ratings-info-top .fa-explanation {text-align: center; padding: 10px; margin-bottom: 10px; background: #FFF;}
.user-ratings-info-top .fa-explanation .text {margin-bottom: 15px;}
.user-ratings-info-top .fa-explanation img {vertical-align: middle; margin-left: 5px; height: 70px; border: 1px solid #555; border-radius: 35px;}
.user-ratings-info-top .fa-explanation #tooltip-new {position: relative; display: inline-block; padding: 5px 3px; right: auto; top: auto; margin-right: 5px;}
.user-ratings-info-top .fa-explanation .th-cat {width: 70px; height: 70px; line-height: 70px; border: 1px solid #689f38; color: #689f38; display: inline-block; border-radius: 35px; margin-right: 20px;}
.user-ratings-info-top .fa-explanation .th-cat i {font-size: 40px; color: inherit; vertical-align: middle;}

.user-ratings-wrapper {margin: 0 0 30px 5px;  border-left: 2px solid #CCC; }
.user-ratings-header {color: #333333; font-size: 16px; margin: 5px 2px 0 0; padding: 3px 8px; border-bottom: 2px solid #CCC;}
.user-ratings-movie {display: flex; justify-content: space-between; background: #ffffff; margin: 0 5px 10px 0; padding: 5px; position: relative; }
.user-ratings-movie .user-ratings-movie-item {margin: 10px; width: 100%;}
.user-ratings-movie .user-ratings-movie-rating {display: inline-block; border:1px solid #ddd; width: 120px; text-align:center; margin: 10px; }
.user-ratings-movie .user-ratings-movie-rating .ur-mr-rat{ color:#666666;font-size:28px;font-weight:bold; }
.user-ratings-movie .user-ratings-movie-rating .ur-mr-rat-img{ padding: 1px; }
.user-ratings-movie .user-ratings-movie-rating .ur-mr-rat-text{ padding: 2px; color:#666666;font-size:14px; }
.user-ratings-movie .main-avr-ur-wrapper{ color: #333; padding: 5px 0px; border-radius: 6px; text-align: center;}
.user-ratings-movie .main-avr-ur-wrapper .avgrat-box-ur{ font-size: 16px; text-align: center; color: #FFFFFF; letter-spacing: -1px; width: 2em; height: 1.6em; line-height: 1.6em; margin: 0 auto;
                                                         border-radius: .3em; box-sizing: border-box; font-weight: normal; display: inline-block; border: 1px solid #900; background: #900;font-weight: bold;}
.user-ratings-movie .main-avr-ur-wrapper .date-wrapper small{ font-size: 10px; color: #555; }

.go-down{ float: left; background: #F5F5F5; font-size: 11px; padding: 1px 3px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
.go-up{ float: left !important;}

/* usercatratings */
#user-cat-info-top{ margin: 20px 5px}
#user-cat-info-top a {margin-left: 10px;}
#user-cat-info-top a i {color: inherit; font-size: 10px;}

.user-cratings-wrapper{ margin: 0 10px 50px;}
.user-cratings-movie{ background: #ffffff; margin: 15px 0; padding: 10px; position: relative; box-shadow: 0 3px 5px #AFAFAF; display: flex; align-items: flex-start;}
.user-cratings-movie .user-cratings-movie-item{ margin-left: 10px; margin-right: 10px;}
.user-cratings-movie .user-cratings-movie-rating{ border:1px solid #ddd; width: 120px; text-align:center;}
.user-cratings-movie .user-cratings-movie-rating .ur-cr-rat{ color:#666666;font-size:28px;font-weight:bold;}
.user-cratings-movie .user-cratings-movie-rating .ur-cr-rat-img{ padding: 1px;}
.user-cratings-movie .user-cratings-movie-rating .ur-cr-rat-text{ padding: 2px; color:#666666;font-size:14px;}
.user-cratings-movie .rate-movie-box{ margin: 0px;}

.ui-selectmenu-menu .ui-menu .ui-menu-item-wrapper { padding: .8em .5em .8em 3em;}
.ui-selectmenu-menu .ui-menu .awe-cont{ padding: .5em;}
.ui-selectmenu-menu .ui-menu .ui-menu-item .ui-icon { height: 24px; width: 24px; top: 0.1em; margin-left: 5px;}

.ui-selectmenu-menu .ui-icon, .ui-selectmenu-menu .ui-widget-content .ui-icon{ background-image: none;}
.ui-state-active .ui-icon, .ui-button:active .ui-icon{ background-image: none;}

.font-fa-icon:before{ font-family: "Font Awesome 5 Pro"; display: inline-block; vertical-align: middle; font-weight: 900; font-size: 14px;
                        margin-right: 10px; margin-left: 0px; color: #447cad; border-radius: 20px; border: 1px solid #a2a2a2; height: 23px; width: 23px; line-height: 23px; text-align: center;}
.cat-fa-icon:before{ content: "\f145"}
.tv-fa-icon:before{ content: "\f401"}

.ui-selectmenu-menu .ui-icon.new_hbo_es_icon, .ui-selectmenu-menu .ui-icon.new_hbo_icon, .ui-selectmenu-menu .ui-icon.upc_hbo_icon {
    background: url("/images/com/categories/hbo_circle.gif") top center / 24px 24px;
}
.ui-selectmenu-menu .ui-icon.new_netflix_icon, .ui-selectmenu-menu .ui-icon.upc_netflix_icon{
    background: url("/images/com/categories/netflix_circle.gif") top center / 24px 24px;
}
.ui-selectmenu-menu .ui-icon.new_movistar_f_icon, .ui-selectmenu-menu .ui-icon.new_movistar_s_icon{
    background: url("/images/com/categories/m_circle.gif") top center / 24px 24px;
}
.ui-selectmenu-menu .ui-icon.new_amazon_es_icon, .ui-selectmenu-menu .ui-icon.new_amazon_icon, .ui-selectmenu-menu .ui-icon.upc_amazon_icon{
    background: url("/images/com/categories/amazon_circle.gif") top center / 24px 24px;
}
.ui-selectmenu-menu .ui-icon.new_filmin_icon{
    background: url("/images/com/categories/filmin_circle.gif") top center / 24px 24px;
}
.ui-selectmenu-menu .ui-icon.upc_rakuten_icon, .ui-selectmenu-menu .ui-icon.new_rakuten_icon{
    background: url("/images/com/categories/rakuten_circle.gif") top center / 24px 24px;
}
.ui-selectmenu-menu .ui-icon.disneyplus_icon{
    background: url("/images/com/categories/disney_circle.gif") top center / 24px 24px;
}
.ui-selectmenu-menu .ui-icon.apple_tv_plus_icon{
    background: url("/images/com/categories/apple_circle.gif") top center / 24px 24px;
}

.user-cat-ratings .top-info-wrapper{display: flex; justify-content: space-between; align-items: center; text-align: right; position: relative; margin: 20px 5px 30px 5px; padding: 10px; background: #F5F5F5;}
.user-cat-ratings .top-info-wrapper .top-info-wrapper-content {display: grid; grid-template-columns: auto auto; justify-content: stretch; width: 100%;}
.user-cat-ratings .top-info-wrapper .top-info-wrapper-content > div:first-child {justify-self: start;}
.user-cat-ratings .top-info-wrapper .cv-wrapper {margin: 0; padding: 0;}
.user-cat-ratings .top-info-wrapper .cv-btn {background: #FFF;}
.user-cat-ratings .top-info-wrapper #user-cat-info-top {margin: 0; display: flex; justify-content: flex-end;}
.user-cat-ratings .top-info-wrapper #user-cat-info-top .combo > a {display: inline-block; margin-top: 8px;}
.user-cat-ratings .top-info-wrapper #user-cat-info-top .combo .ui-selectmenu-button.ui-button {width: 20em;}
.user-cat-ratings .top-info-wrapper #user-cat-info-top .cat-img {width: 40px; height: 40px; border: 1px solid #326E9C; border-radius: 25px; padding: 5px; background: #FFF; margin-left: 15px; text-align: center;}
.user-cat-ratings .top-info-wrapper #user-cat-info-top .cat-img > img {width: 40px; border-radius: 20px; vertical-align: middle;}
.user-cat-ratings .top-info-wrapper #user-cat-info-top .cat-img > i {font-size: 30px; line-height: 35px; color: #326E9C;}
.user-cat-ratings .empty-list {padding: 10px;}



/* userrec */
.user-rec-wrapper{ padding: 5px; margin: 10px; background: #F2F2F2; padding: 5px;}
.user-rec-wrapper .movie-rec-wrapper{ background: #FFFFFF; position: relative; margin: 10px 10px 20px 10px; padding: 10px; display: flex;}
.user-rec-wrapper .movie-rec-wrapper .user-rec-rating{ border:1px solid #ddd; width: 120px; text-align:center;}
.user-rec-wrapper .movie-rec-wrapper .user-rec-rating .rating-box{color:#666666;font-size:28px;font-weight:bold;}
.user-rec-wrapper .movie-rec-wrapper .user-rec-rating .rating-img-box{ padding: 1px;}
.user-rec-wrapper .movie-rec-wrapper .user-rec-rating .rating-text-box{ padding: 2px; color:#666666;font-size:14px;}
.user-rec-wrapper .movie-rec-wrapper .user-rec-movie {width: 100%; margin: 0 15px;}
.user-rec-wrapper .movie-rec-wrapper .user-rec-rate-box .rate-movie-box {margin: 0; padding: 0;}
.user-rec-wrapper .movie-rec-wrapper .addtobl {display: flex; align-items: center; justify-content: center; border: 1px solid #CCC; margin-top: 10px; padding: 5px; width: 100%; box-sizing: border-box; border-radius: 5px;}
.user-rec-wrapper .movie-rec-wrapper .addtobl:hover {background: #EEE;}
.user-rec-wrapper .movie-rec-wrapper .addtobl i {font-size: 18px; margin: 0 5px;}

.movie_info_cont {color:#666;}
.movie_info_cont a {text-decoration:none; color:#666;}



    /* new cats */
.cat-header {display: flex; position: relative; margin-top: 5px;}

.cat-logo {display: inline-block; position: relative;}
.cat-logo img {height: 60px; vertical-align: baseline; margin: 0 5px; cursor: pointer;}
.cat-logo .show-cats {position: absolute; right: 10px; bottom: 3px; font-size: 12px; width: 18px; height: 18px; line-height: 16px; text-align: center; z-index: 18; cursor: pointer;}
.cat-logo .show-cats.active {color: green; border: 1px solid green;}
.cat-logo .show-cats i {color: inherit;}

h1 {display: inline-block; vertical-align: baseline}

.cat-logos-links {position: absolute; top: -10px; left: 80px; z-index: 15; display: flex;}
.cat-logos-links .triangle {width: 0; height: 0; border-style: solid; border-width: 46px 40px 47px 0; border-color: transparent #F5F5F5 transparent transparent; vertical-align: middle;}
.cat-logos-links .logos {display: flex; background: #F5F5F5; padding: 10px; vertical-align: middle; overflow: scroll; box-shadow: inset -40px 0 30px -20px hsla(0,0%,0%,.25);}
.cat-logos-links img {vertical-align: middle; margin: 0 10px; height: 70px;}
.cat-logos-links #tooltip-new {position: relative; display: inline-block; padding: 5px 3px; right: auto; top: auto; margin-right: 5px;}
.cat-logos-links .th-cat {height: 70px; line-height: 70px; margin-right: 20px; text-align: center; background: #FFF; padding: 0 10px;}
.cat-logos-links .th-cat i {font-size: 40px; color: inherit;  vertical-align: middle;}
.cat-logos-links .disabled {pointer-events: none; opacity: 0.4;}



:root {
    --cat-logo-height: 60px;
    --swiper-nav-size-h: 90px;
    --swiper-nav-size-w: 50px;
}
.cat-header {
    .cat-logos-links-modal {
        .img-wrap {aspect-ratio: 16 / 9;  margin: 10px;  height: var(--swiper-nav-size-h); text-align: center;
            img { height: var(--swiper-nav-size-h); }
        }
    }

    .swiper-container {width: 800px; padding: 15px 0 30px 0; z-index: 1; background: var(--bs-white);;
        .swiper-slide {opacity: 0.7; overflow: hidden; transition: .7s; text-align: center; aspect-ratio: 16 / 9; height: var(--cat-logo-height); background: var(--bs-white); box-shadow: 0px 2px 3px var(--bs-gray-500);
            img {height: var(--cat-logo-height)}
            &.active {opacity: 1; z-index: 2; transform: scale(1.3) !important;}                
        }                
    }
    
    .gradient {
        position: absolute; top: 6px; height: 85px; width: 70px; background: var(--bs-white); z-index: 15;
        &.gradient-prev {left: 0;  background: rgb(255,255,255); background: linear-gradient(270deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 60%);  }
        /* &.gradient-prev {left: 0; background: linear-gradient(270deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8981793400954132) 40%, rgba(255,255,255,1) 100%);} */
        &.gradient-next {right: 0; background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 60%); }
    
        .swiper-nav {position: absolute; text-align: center; z-index: 15; background: var(--bs-white); 
            top: 14px; height: var(--swiper-nav-size-w); width: var(--swiper-nav-size-w); line-height: var(--swiper-nav-size-w); border-radius: var(--swiper-nav-size-w); 
            border: 1px solid var(--bs-gray-400); 
            i {font-size: 25px;}
            &.swiper-next {right: 0;}
            &:hover {background: var(--bs-gray-100);}
       }
    }
    /*
     .swiper-nav {position: absolute; text-align: center; z-index: 15; background: var(--bs-white); 
        top: 5px; height: var(--swiper-nav-size-h); width: var(--swiper-nav-size-w);  line-height: var(--swiper-nav-size-h);
        i {font-size: 25px;}
        
        &.swiper-prev {left: 0; box-shadow: 15px 0 9px -6px rgba(115,115,115,0.75);}
        &.swiper-next {right: 0; box-shadow: -15px 0 9px -6px rgba(115,115,115,0.75);}
    } 
    */
}


.cat-list #wrapper-cat{ margin: 0; padding: 0; background: none;}
.cat-list .top-movie {background: #ffffff; margin: 20px 10px; border: 1px solid #CCC; border-left: 3px solid #447CAD;}
.cat-list .top-movie .movie-card {padding: 15px;}
.cat-list .cat-info {padding: 0 5px; display: flex; align-items: center; justify-content: flex-start;}
.cat-list .cat-info .cat-info-data {display: inline-block; padding: 15px 10px; vertical-align: middle;}
.cat-list .cat-info .cat-info-data.expl {border-right: 1px solid #CCC; }
.cat-list .cat-info .cat-info-data .date { color: #333333; font-weight: bold; }
.cat-list .cat-info .cat-info-data .time { color: #555555; margin-left: 5px; font-weight: bold;}
.cat-list .cat-info .cat-info-data .rentals {margin-bottom: 5px;}
.cat-list .cat-info .cat-info-data .rentals > span {display: inline-block; width: 20px; height: 20px; line-height: 20px; background: #79CB72; border-radius: 10px; text-align: center;}
.cat-list .cat-info .cat-info-data .rentals i {color: #FFF;}
.cat-list .cat-info .jw-wrapper, .cat-list .cat-info .jw-wrapper-alone, .cat-list .cat-info .jw-wrapper-link{ margin-left: auto; align-items: center; justify-content: center;}
.cat-list .cat-info .jw-wrapper .body, .cat-list .cat-info .jw-wrapper-alone .body{ display: inline-flex;}
.cat-list .cat-info .jw-wrapper .body .mone-type-wrapper{ margin-right: 5px; }
.cat-list .cat-info .jw-wrapper .body .mone-type-wrapper .prov-offers-wrapper, .cat-list .cat-info .jw-wrapper-alone .body .mone-type-wrapper .prov-offers-wrapper{display: inline-flex; cursor: pointer;}
.cat-list .cat-info .jw-wrapper-alone .body .prov-offers-wrapper a img.icon-1{ height: 40px; box-shadow: 2px 3px 4px #bbbbbb;}
.cat-list .cat-info .jw-wrapper-alone .body .prov-offers-wrapper a:hover img{ box-shadow: 2px 3px 4px #e2e2e2; }
.cat-list .cat-info .jw-wrapper .body .prov-offers-wrapper img{ height: 30px; box-shadow: 2px 3px 4px #bbbbbb;}
.cat-list .cat-info .jw-wrapper .body .prov-offers-wrapper img:hover{ box-shadow: 2px 3px 4px #e2e2e2;}
.cat-list .catbygenre ul {list-style: none; margin: 0; padding: 0;}
.cat-list .catbygenre .title {margin: 10px; font-size: 16px; padding: 5px; text-align: center;}
.cat-list .catbygenre .top-anchors {margin: 15px 10px 30px 10px; text-align: center;}
.cat-list .catbygenre .go-up-bar {margin: -15px 10px 50px 10px;}
.cat-list .catbygenre .go-up-bar a {float: none !important;}
.cat-list .rdate-cat {background: #447CAD; color: #FFF; margin: 10px; padding: 5px; font-size: 16px; margin-top: 40px;}
.cat-list .rdate-cat.rdate-cat-first {margin-top: 15px;}
.cat-list .rdate-cat i {color: inherit; vertical-align: baseline; width: 20px;}

.cat-list .calendar-box .calendar {margin: 0 15px 0 10px;}
.cat-list .calendar-box .calendar .actual-cat > a {background: #5AE05A !important;}
.cat-list .calendar-box .calendar .next-cat > a {background: #498E49 !important; color: #FFF !important;}
.cat-list .calendar-box .ui-datepicker {width: 100% !important; }
.cat-list .calendar-box .legend {list-style: none; margin: 5px 10px; padding: 0;}
.cat-list .calendar-box .legend > li {display: inline-block; margin-right: 10px; font-size: 10px;}
.cat-list .calendar-box .legend .example {display: inline-block; width: 20px; height: 10px;}
.cat-list .calendar-box .legend .actual-cat {background: #5AE05A;}
.cat-list .calendar-box .legend .next-cat {background: #498E49;}


.cat-list.main-view .movie-poster {display: inline-block; vertical-align: top; width: 190px; margin: 5px; position: relative;}
.cat-list.main-view .movie-poster .release-corner {position: absolute; top: 0; left: 12px; width: 0; height: 0; border-style: solid; border-width: 60px 60px 0 0;}
.cat-list.main-view .movie-poster .release-corner.new {border-color: #689f38 transparent transparent transparent; z-index: 1;}
.cat-list.main-view .movie-poster .release-corner.prox {border-color: #FFA500 transparent transparent transparent; z-index: 1;}
.cat-list.main-view .movie-poster .release-corner.prox2 {border-color: #557CAD transparent transparent transparent; z-index: 1;}
.cat-list.main-view .movie-poster .release-text {position: absolute; top: 5px; left: 10px; transform: rotate(-45deg); text-align: center; color: #FFF; font-size: 11px; z-index: 2;}
.cat-list.main-view .movie-poster .release-text-prox2 {margin: -2px 0 0 8px; z-index: 2;}
.cat-list.main-view .movie-poster .rentals {position: absolute; width: 25px; height: 25px; line-height: 25px; bottom: 55px; left: 10px; text-align: center; border-radius: 21px; color: #FFF; box-shadow: 1px 1px 2px #333; background: #79CB72;}
.cat-list.main-view .movie-poster .rentals i {color: inherit;}
.cat-list.main-view .movie-poster .more-info {position: absolute; width: 40px; height: 40px; line-height: 40px; bottom: 55px; right: 10px; text-align: center; border: 2px solid #FFF; border-radius: 21px; color: #FFF; box-shadow: 1px 1px 2px #333; background: rgba(100, 100, 100, 0.4); cursor: pointer; z-index: 1;}
.cat-list.main-view .movie-poster .more-info i {color: inherit; }
.cat-list.main-view .movie-poster .more-info:hover {background: rgba(100, 100, 100, 0.6); font-size: 20px;}
.cat-list.main-view .movie-poster .hide-info {display: none;}
.cat-list.main-view .movie-poster img {height: 282px; border-radius: 5px; box-shadow: 2px 3px 4px #BBBBBB;}
.cat-list.main-view .movie-poster .horizontalImage{ width: 190px; height: 282px; display: flex; justify-content: center; align-items: center; background: #000000; border-radius: 5px;}
.cat-list.main-view .movie-poster .horizontalImage img{ width: inherit; border-radius: 0px; box-shadow: unset; height: auto; }
.cat-list.main-view .movie-poster .movie-title {height: 40px; line-height: 18px; text-align: center; overflow: hidden;}
.cat-list.main-view .row-info {margin: 10px; border: 1px solid #DDD; display: none; }
.cat-list.main-view .row-info .movie-card {padding: 10px;}
.cat-list.main-view .movie-poster .angle {width: 0; height: 0; display: none;}
.cat-list.main-view .movie-poster .angle:after,
.cat-list.main-view .movie-poster .angle:before {border-left: 12px solid transparent; border-right: 12px solid transparent; border-bottom: 12px solid #fff; bottom: -16px; content: ''; left: 50%; margin-left: -12px; position: absolute;}
.cat-list.main-view .movie-poster .angle:before {border-left: 13px solid transparent; border-right: 13px solid transparent; border-bottom: 13px solid #CCC; bottom: -15px; margin-left: -13px;}
.cat-list.main-view .movie-poster .mc-oposter.no-image{ width: 190px; height: 282px;}
.cat-list.main-view .movie-poster .mc-oposter.no-image .wrapper-info-no-image{ top: 80px;}


.cat-disclaimer {margin-top: 50px; font-size: 11px; text-align: center;}



.user-ratings-list > .header {display: flex; justify-content: space-between; margin: 10px;}
.user-ratings-list > .header > div {width: 100%;}
.user-ratings-list > .header .sub-header{ text-align: left; margin-bottom: 10px;}
.user-ratings-list > .header .combo { text-align: right;}
.user-ratings-list > .header .count { margin-bottom: 10px;}
.user-ratings-list .pager {margin: 20px 0;}
.user-ratings-list .filter-templates {display: none;}
.user-ratings-list .sort-pop .uncomplete-filter {box-shadow: 2px 3px 4px #BBBBBB; padding: 0; margin: 0; position: static;}
.user-ratings-list .sort-pop .uncomplete-filter > div {display: none;  padding: 10px;}




.user-ratings-list-sp .top-info-wrapper {display: flex; justify-content: space-between; align-items: center; text-align: right; position: relative; } 
.user-ratings-list-sp .top-info-wrapper .top-info-wrapper-content {display: grid; grid-template-columns: auto auto; justify-content: stretch; width: 100%;} 
.user-ratings-list-sp .top-info-wrapper .top-info-wrapper-content > div:first-child {justify-self: start;}
.user-ratings-list-sp .top-info-wrapper .cv-wrapper {margin: 0; padding: 0; display: inline-flex;}
.user-ratings-list-sp .top-info-wrapper .cv-btn {background: #FFF;}
.user-ratings-list-sp .top-info-wrapper h1 {font-size: 18px;}
.user-ratings-list-sp .top-info-wrapper .applied-sort .content {cursor: pointer; font-size: 11px;}
.user-ratings-list-sp .top-info-wrapper .applied-sort .content .active-filter {font-size: 14px; font-weight: bold; margin-bottom: 5px;}
.user-ratings-list-sp .top-info-wrapper .applied-sort .content > i {float: right; font-size: 25px; margin-top: 5px;}
.user-ratings-list-sp .top-info-wrapper .applied-sort .content > div {margin-right: 40px;}
.user-ratings-list-sp .bottom-bar {margin-top: 50px;}
.user-ratings-list-sp .no-ratings {padding: 10px; text-align: center; font-size: 14px;}
.user-ratings-list-sp .no-ratings a {display: inline-block; font-size: 16px; margin-top: 10px;}
.user-ratings-list-sp .ratings-by-type {list-style: none; margin: 0; padding: 0;  display: flex; justify-content: space-around; margin-top: 10px;}
.user-ratings-list-sp .ratings-by-type > li {text-align: center; }
.user-ratings-list-sp .ratings-by-type a {font-size: 14px;}
.user-ratings-list-sp .ratings-by-type a strong {background: #AAA; color: #FFF; border-radius: 10px; padding: 1px 5px;}


.cat-links2 {list-style: none; margin: 15px 0; padding: 0;
    & > li {width: 100px; margin: 15px; 
        .cat-icon { box-shadow: 0px 2px 3px var(--bs-gray-500); aspect-ratio: 16 / 9;
            i {font-size: 30px; margin: 10px auto;}
            img {height: 100%;}
        }
    }
}

/* seguramente reemplazado por .cat-links2*/
.cat-links-box {margin-top: 50px; padding: 10px;}
.cat-links {list-style: none; margin: 15px 0; padding: 0; display: grid; width: 100%; grid-template-columns: repeat(8, auto); justify-items: stretch;  gap: 20px 0;}
.cat-links > li {text-align: center; width: 90px; overflow: hidden; text-overflow: ellipsis;}
.cat-links .cat-icon {display: flex; width: 60px; height: 60px; margin: 0 auto 10px auto; border: 1px solid #CCC; border-radius: 30px; align-items: center;} 
.cat-links a:hover .cat-icon {border-color: #447cad;} 
.cat-links .cat-icon img {border-radius: 30px; margin: 0 auto; width: 40px;}
.cat-links .cat-icon i {font-size: 30px; margin: 10px auto;}

.popover .popover-body #stream-wrapper.vod-wrapper .title {padding: 10px; background: #EEE; }
.popover .popover-body #stream-wrapper.vod-wrapper .fa-btn-upd{display: none;}
.popover .popover-body #stream-wrapper.vod-wrapper .body {padding: 10px; display: grid; grid-auto-flow: column; grid-template-rows: repeat(2, auto); column-gap: 15px;}
.popover .popover-body #stream-wrapper.vod-wrapper .sub-title {margin: 0 0 5px 0; text-align: center;}
.popover .popover-body #stream-wrapper.vod-wrapper .prov-offers-wrapper {max-width: 85px; display: block; margin: 0px;}
.popover .popover-body #stream-wrapper.vod-wrapper .prov-offers-wrapper > a {display: inline-block; margin: 5px;}
.popover .popover-body #stream-wrapper.vod-wrapper .prov-offers-wrapper > a img{ height: 30px;}
.popover .popover-body #stream-wrapper.vod-wrapper .justwatch-logo {margin-right: 10px;}
