@font-face{
    font-family:Font;
    src:url(../fonts/font.ttf)
}

html{
    height:100%;
    margin:0px
}
body{
    height:100%;
    margin:0px
}
body.dark-mode{
    background:#000010
}
body.light-mode{
    background:#ffffff
}
.dark-mode p{
    color:#b3b3b3
}
.light-mode p{
    color:#555
}
.dark-mode h1,.dark-mode h2,.dark-mode h3,.dark-mode h4,.dark-mode h5,.dark-mode h6{
    color:#eee
}
.light-mode h1,.light-mode h2,.light-mode h3,.light-mode h4,.light-mode h5,.light-mode h6{
    color:#333
}
.sidebar{
    padding:0px;
    z-index:16;
    width:250px;
    position:relative
}
.light-mode #subscribe-plan label{
    color:#555
}
.dark-mode .sidebar{
    box-shadow:#11141c 0px 0px 10px -3px;
    background:#000010!important
}
.light-mode .sidebar{
    box-shadow:#4a4a4a59 0px 0px 10px -3px;
    background:white
}
.logo-app{
    height:105px;
    text-align:center
}
.logo-app>img{
    padding:10px;
    width:100%;
    max-width:100%;
    max-height:100%
}
.btn-subscription{
    box-shadow:inset 0 1px 0 #ffa501,0 0px 2px #ffa501!important;
    background-color:#ffa501!important;
    border:none!important;
    background-image:none!important;
    color:white!important;
    border-radius:0px!important;
    text-shadow:none!important;
    width:calc(100% - 10px);
    padding:6px!important;
    margin-bottom:0px;
    border-top-right-radius:16px!important;
    border-bottom-right-radius:16px!important;
    margin-top:10px
}
.padding-lr-10{
    padding-left:10px;
    padding-right:10px
}
.padding-10{
    padding:10px
}
.main-row{
    margin-left:-20px!important;
    height:100%
}
.container-fluid{
    height:100%;
    padding-right:15px!important;
    padding-left:20px!important
}
.nav-bar-container{
    overflow:auto;
    position:absolute;
    bottom:83px;
    width:100%;
    top:105px;
    height:auto
}
.dark-mode .nav-bar-container{
    border-top:1px solid #12151c
}
.light-mode .nav-bar-container{
    border-top:1px solid #e1e1e1
}
.bottom-navbar{
    position:absolute;
    bottom:0px;
    width:100%;
    font-size:10pt!important
}
.dark-mode .bottom-navbar{
    border-top:1px solid #12151c
}
.light-mode .bottom-navbar{
    border-top:1px solid #e1e1e1
}
.left-navbar{
    padding:0px
}
.left-navbar>.navbar-nav{
    width:100%
}
.left-navbar>ul{
    margin-left:0px
}
.dark-mode .left-navbar>ul>li:hover{
    background-color:#141421
}
.light-mode .left-navbar>ul>li:hover{
    background-color:#f1f1f1
}
.left-navbar>ul>li>a{
    padding-top:10px;
    margin-bottom:2px;
    margin-top:2px;
    padding-left:30px!important
}
.dark-mode .left-navbar>ul>li>a{
    color:#b3b3b3!important
}
.light-mode .left-navbar>ul>li>a{
    color:#555!important
}
.left-navbar>ul>li.active>a{
    border-left:2px solid #ffa501;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    color:#ffa501!important
}
.title-app{
    color:#ffa501;
    padding:10px
}
.main{
    margin-left:0px!important;
    padding:0px;
    overflow:scroll;
    height:100%;
    width:calc(100% - 230px);
    overflow-x:hidden
}
.page-header{
    border-bottom:none!important;
    margin-bottom:0px!important
}
.tab-title{
    padding-top:9px;
    font-size:16pt;
    font-weight:bold;
    height:40px;
    line-height:20px;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
    text-align:left
}
.dark-mode .tab-title{
    color:#eee
}
.light-mode .tab-title{
    color:#555
}
.top-nav > .nav-search-box{
    display:inline-table;
    height:50px
}
.top-nav{
    padding-top:20px;
    padding-bottom:10px;
    padding-left:10px;
    padding-right:10px;
    margin-right:0px!important;
    margin-left:0px!important
}
.content-section{
    padding-top:20px;
    padding-bottom:10px;
    padding-left:10px;
    padding-right:10px;
    margin-right:0px!important;
    margin-left:0px!important
}
.search-group > input{
    font-size:10pt;
    margin-left:30px;
    margin-top:0px!important;
    height:36px!important;
    min-height:36px!important;
    background:transparent!important;
    border:none!important;
    box-shadow:none!important;
    width:calc(100% - 100px)!important
}
.dark-mode .search-group > input{
    color:#eee
}
.search-group > i{
    margin-top:9px;
    display:inline-block;
    position:absolute;
    margin-left:12px
}
.search-group>.btn{
    font-size:9pt;
    border-radius:5px;
    position:absolute;
    margin-top:2px;
    margin-bottom:2px;
    border-right:15px;
    right:3px;
    height:29px;
    top:0px;
    border-left:1px solid;
    border-top-left-radius:0px;
    border-bottom-left-radius:0px;
    border-left-color:#ffa502;
    color:#eee
}
.search-group{
    width:100%;
    height:38px;
    border-radius:5px;
    position:relative;
    border:1px solid #ffa502
}
.light-mode .search-group{
    border:1px solid #ffa502;
    background:#ffffff;
    color:black
}
.dark-mode .search-group{
    background:#000000;
    border:1px solid #ffa502;
    color:#b3b3b3
}
.navbar-form{
    margin-top:0px!important
}
.account-action .btn.focus,.account-action .btn:focus{
    outline:0!important;
    box-shadow:0 0 0 0.2rem rgba(255,255,255,0.25)!important
}
.top-nav .nav>li>a .caret{
    margin-top:12px;
    font-size:75px;
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-top:5px solid #ffa501
}
.top-nav .nav>li>a{
    height:30px;
    padding-top:0px;
    font-size:12pt!important
}
.top-nav .nav>li>a{
    height:30px;
    padding-top:0px;
    font-size:12pt!important
}
.top-nav .nav>li>a:hover,.top-nav .nav>li>a:focus{
    background-color:transparent!important;
    border-color:none!important
}
.dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus,.dropdown-submenu:hover>a,.dropdown-submenu:focus>a{
    text-decoration:none!important;
    color:#ffffff!important;
    background-color:#f1f1f1!important;
    background-image:-moz-linear-gradient(top,#ffa501,#ffa501)!important;
    background-image:-webkit-gradient(linear,0 0,0 100%,from(#ffa501),to(#ffa501))!important;
    background-image:-webkit-linear-gradient(top,#ffa501,#ffa501)!important;
    background-image:-o-linear-gradient(top,#ffa501,#ffa501)!important;
    background-image:linear-gradient(to bottom,#ffa501,#ffa501)!important;
    background-repeat:repeat-x!important;
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffa501',endColorstr='#ffa501',GradientType=0)!important
}
.actor{
    margin-top:20px;
    margin-bottom:10px;
    margin-right:10px;
    display:inline-table;
    text-align:center;
    transition:transform .1s;
    text-decoration:none!important;
    max-width:150px
}
.actor:hover{
    text-decoration:none!important
}
.light-mode .actor label{
    color:#555;
    font-size:10pt;
    max-width:150px;
    white-space:pre-wrap
}
.dark-mode .actor label{
    color:#ccc;
    font-size:10pt
}
.actor span{
    font-size:11pt;
    text-align:center;
    display:block;
    font-weight:800;
    line-height:1.2em;
    white-space:normal;
    max-width:100%
}
.dark-mode .actor span{
    color:#eee
}
.light-mode .actor span{
    color:#555
}
.actor img{
    height:70px;
    width:70px;
    border-radius:50px;
    margin-bottom:10px
}
.dark-mode .actor img{
    box-shadow:0px 0px 5px 2px #11141c
}
.light-mode .actor img{
    box-shadow:0px 0px 5px 2px #4a4a4a59
}
.actor-large img{
    height:auto;
    border-radius:5px;
    margin-bottom:10px;
    width:100%;
    min-height:120px
}
.dark-mode .actor-large img{
    box-shadow:0px 0px 5px 2px #11141c
}
.light-mode .actor-large img{
    box-shadow:0px 0px 5px 2px #4a4a4a59
}
.actor-large{
    margin-top:20px;
    margin-bottom:10px;
    display:inline-table;
    margin-right:0px;
    text-align:center;
    text-decoration:none!important;
    max-width:100%
}
.actor:hover{
    -ms-transform:scale(1.2);
    -webkit-transform:scale(1.2);
    transform:scale(1.2);
    z-index:2
}
.flix-scroll-x{
    width:100%;
    overflow-x:scroll;
    overflow-y:hidden;
    white-space:nowrap;
    position:relative
}
.flix-scroll-x::-webkit-scrollbar{
    display:none
}
.flix-carousel{
    position:relative;
    width:100%;
    min-height:100px
}
.prev_btn{
    display:none;
    width:40px;
    position:absolute;
    left:0px;
    top:0px;
    bottom:0px;
    z-index:3;
    border:none;
    font-size:15pt
}
.dark-mode .prev_btn{
    color:#b3b3b3;
    background:rgb(2,0,36);
    background:linear-gradient(to left,transparent,black)
}
.light-mode .prev_btn{
    color:#555;
    background:rgb(2,0,36);
    background:linear-gradient(90deg,rgb(255,255,255) 20%,rgba(255,255,255,0.01) 80%)
}
.next_btn{
    width:40px;
    position:absolute;
    right:0px;
    top:0px;
    bottom:0px;
    z-index:3;
    border:none;
    font-size:15pt
}
.dark-mode .next_btn{
    background:rgb(2,0,36);
    background:linear-gradient(to right,transparent,black);
    color:#b3b3b3
}
.light-mode .next_btn{
    background:rgb(2,0,36);
    background:linear-gradient(90deg,rgb(255,255,255,0.02) 20%,rgba(255,255,255) 80%);
    color:#555
}
.flix-scroll-x{
    -ms-overflow-style:none;
    scrollbar-width:none
}
.channel>div>p{
    z-index:2;
    display:inline-block;
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
    background:white;
    padding:1px 7px 1px 7px;
    box-shadow:1px 0px 2px 0px black;
    color:#555!important
}
.channel>div>p.two{
    margin-left:-10px;
    padding:1px 7px 1px 15px
}
.channel>div>span{
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
    background:#673AB7;
    padding:1px 7px 1px 7px;
    position:relative;
    z-index:1;
    display:inline-block;
    box-shadow:1px 0px 2px 0px black
}
.channel>div{
    position:absolute;
    left:10px;
    color:white;
    top:22px;
    font-size:9pt;
    font-weight:bold
}
.channel{
    position:relative;
    padding:10px;
    padding-right:0px;
    display:inline-block;
    transition:transform .1s;
    margin-bottom:5px;
    margin-top:5px
}
.channel:hover{
    -ms-transform:scale(1.4);
    -webkit-transform:scale(1.4);
    transform:scale(1.4);
    z-index:2
}
.dark-mode .channel img:hover{
    box-shadow:0px 0px 2px 0px #000000
}
.light-mode .channel img:hover{
    box-shadow:0px 0px 2px 0px #4a4a4a59
}
.channel img{
    transition:transform .1s;
    background:grey;
    width:150px;
    min-height:70px;
    border-radius:5px;
    height:auto
}
.dark-mode .channel img{
    box-shadow:0px 0px 10px 0px #000000
}
.light-mode .channel img{
    box-shadow:0px 0px 5px 2px #4a4a4a59
}
.episode{
    position:relative;
    display:inline-block;
    border-radius:18px;
    margin-left:10px;
    transition:transform .1s;
    margin-top:15px;
    margin-bottom:15px
}
.episode:hover{
    -ms-transform:scale(1.1);
    -webkit-transform:scale(1.1);
    transform:scale(1.1);
    z-index:2
}
.episode img{
    background:grey;
    width:320px;
    min-width:320px;
    min-height:200px;
    border-radius:5px
}
.dark-mode .episode img{
    box-shadow:0px 0px 10px 0px #000000
}
.dark-mode .episode img{
    box-shadow:0px 0px 5px 2px #4a4a4a59
}
.episode .episode-detail{
    height:100%;
    width:100%;
    position:absolute;
    top:0px;
    left:0px;
    border-radius:5px
}
.dark-mode .episode .episode-detail{
    background:#000010;
    background:linear-gradient(0deg,#000010d1 10%,rgba(0,0,0,0.32) 100%)
}
.light-mode .episode .episode-detail{
    background:#ffffff;
    background:linear-gradient(0deg,#000000d1 10%,rgba(0,0,0,0.32) 100%)
}
.episode-detail > span{
    position:absolute;
    bottom:0px;
    width:100%;
    padding:8px
}
.episode-detail h4{
    color:white;
    width:100%;
    white-space:pre-line;
    font-size:17pt;
    font-weight:bold
}
.episode-detail p{
    font-size:10pt;
    width:100%;
    white-space:pre-wrap;
    margin-bottom:0px;
    color:#aaa!important;
    height:75px;
    text-overflow:ellipsis;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:4;
    -webkit-box-orient:vertical
}
.poster{
    position:relative;
    padding:10px;
    display:inline-block;
    transition:transform .1s;
    margin-bottom:5px;
    position:relative;
    margin-top:5px
}
.poster>div>div>p{
    z-index:2;
    display:inline-block;
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
    background:white;
    padding:1px 7px 1px 7px;
    box-shadow:1px 0px 2px 0px black;
    color:#555!important
}
.poster>div>div>p.two{
    margin-left:-10px;
    padding:1px 7px 1px 15px
}
.poster>div>div>span{
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
    background:#673AB7;
    padding:1px 7px 1px 7px;
    position:relative;
    z-index:1;
    display:inline-block;
    box-shadow:1px 0px 2px 0px black
}
.poster>div>div{
    position:absolute;
    left:10px;
    color:white;
    top:22px;
    font-size:9pt;
    font-weight:bold
}
.poster:hover{
    -ms-transform:scale(1.14);
    -webkit-transform:scale(1.14);
    transform:scale(1.14);
    z-index:2
}
.poster img{
    transition:transform .1s;
    background:grey;
    width:150px;
    min-height:200px;
    border-radius:5px;
    height:auto
}
.posterhome img{
    transition:transform .1s;
    background:grey;
    width:350px;
    min-height:200px;
    border-radius:5px;
    height:auto
}
.posterhome{
    position:relative;
    padding:10px;
    display:inline-block;
    transition:transform .1s;
    margin-bottom:5px;
    position:relative;
    margin-top:5px
}
.posterhome>div>div>p{
    z-index:2;
    display:inline-block;
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
    background:white;
    padding:1px 7px 1px 7px;
    box-shadow:1px 0px 2px 0px black;
    color:#555!important
}
.posterhome>div>div>p.two{
    margin-left:-10px;
    padding:1px 7px 1px 15px
}
.posterhome>div>div>span{
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
    background:#673AB7;
    padding:1px 7px 1px 7px;
    position:relative;
    z-index:1;
    display:inline-block;
    box-shadow:1px 0px 2px 0px black
}
.posterhome>div>div{
    position:absolute;
    left:10px;
    color:white;
    top:22px;
    font-size:9pt;
    font-weight:bold
}
.posterhome:hover{
    -ms-transform:scale(1.14);
    -webkit-transform:scale(1.14);
    transform:scale(1.14);
    z-index:2
}

.dark-mode .poster img{
    box-shadow:0px 0px 10px 0px #000000
}
.light-mode .poster img{
    box-shadow:0px 0px 5px 2px #4a4a4a59
}
.title-more,.title-more:hover,.title-more:focus,.title-more:active{
    margin-top:5px;
    width:100%;
    font-size:13pt;
    font-weight:800;
    display:block;
    text-decoration:none;
    margin-top:10px;
    color:#ffa501!important
}
.detail-card img{
    height:100%;
    border-bottom-left-radius:10px;
    border-top-left-radius:10px
}
.detail-card{
    display:none;
    border-radius:5px;
    right:10px;
    bottom:10px;
    position:fixed;
    height:240px;
    width:400px;
    background-color:rgba(255,255,255,.8)
}
.detail-card>div{
    position:absolute;
    top:0px;
    position:absolute;
    height:100%;
    width:calc(100% - 160px);
    right:0px;
    left:160px;
    border-bottom-right-radius:10px;
    border-top-right-radius:10px
}
.carousel-item>div{
    padding:0px!important;
    position:relative
}
.carousel-item .carousel-detail>div{
    width:100%;
    position:absolute;
    left:0px;
    right:0px;
    bottom:30px;
    border-radius:5px;
    padding-left:30px
}
.carousel-item .carousel-detail{
    width:calc(100% - 10px);
    position:absolute;
    left:0px;
    height:100%;
    right:10px;
    bottom:0px;
    border-radius:5px
}
.dark-mode .carousel-item .carousel-detail{
    background:#00000045
}
.light-mode .carousel-item .carousel-detail{
    background:#ffffff2b
}
.carousel-item .carousel-detail p{
    font-size:10pt;
    width:calc(100% - 170px);
    color:#eee
}
.carousel-item .carousel-detail button{
    color:white;
    background-color:#ffa501;
    padding:8px 17px 8px 17px;
    border-radius:5px;
    box-shadow:inset 0 1px 0 #ffa501,0 0px 5px #ffa501!important;
    right:10px;
    bottom:-20px;
    position:absolute;
    font-weight:bold;
    text-decoration:none;
    border:none
}
.carousel-item .carousel-detail h3 span{
    margin-left:10px;
    background:#ffa501;
    font-size:11pt;
    padding-left:5px;
    padding-right:5px;
    padding-top:3px;
    padding-bottom:3px;
    border-radius:5px
}
.carousel-item .carousel-detail h3{
    font-size:17pt;
    color:white;
    font-weight:bold
}
.img-fluid{
    max-width:100%!important;
    width:calc(100% - 10px)!important;
    border-radius:5px!important;
    margin-right:10px!important
}
.dark-mode .bg-light{
    background-color:#000010!important
}
.light-mode .bg-light{
    background-color:#ffffff!important
}
#myCarousel .carousel-indicators{
    right:inherit;
    margin-left:30px
}
#myCarousel{
    border-radius:5px;
    overflow:hidden;
    margin-bottom:10px
}
@media (max-width:768px){
    .carousel-inner .carousel-item-right.active,.carousel-inner .carousel-item-next{
        transform:translateX(99%)
    }
    .carousel-inner .carousel-item-left.active,.carousel-inner .carousel-item-prev{
        transform:translateX(-99%)
    }
}
@media (min-width:992px){
    .carousel-inner .carousel-item-right.active,.carousel-inner .carousel-item-next{
        transform:translateX(66%)
    }
    .carousel-inner .carousel-item-left.active,.carousel-inner .carousel-item-prev{
        transform:translateX(-66%)
    }
}
@media (min-width:1700px){
    .carousel-inner .carousel-item-right.active,.carousel-inner .carousel-item-next{
        transform:translateX(40%)
    }
    .carousel-inner .carousel-item-left.active,.carousel-inner .carousel-item-prev{
        transform:translateX(-40%)
    }
}
@media (max-width:768px){
    .carousel-inner .carousel-item>div{
        display:none
    }
    .carousel-inner .carousel-item>div:first-child{
        display:block
    }
}
.carousel-inner .carousel-item.active,.carousel-inner .carousel-item-next,.carousel-inner .carousel-item-prev{
    display:flex
}
.carousel-inner .carousel-item-right,.carousel-inner .carousel-item-left{
    transform:translateX(0)
}
*:focus{
    outline:0!important
}
.light-mode .dropdown-item:focus,.light-mode .dropdown-item:hover{
    background-color:#f1f1f1
}
.dark-mode .dropdown-item:focus,.dark-mode .dropdown-item:hover{
    background-color:#141421
}
.light-mode .btn{
    color:#555
}
.dark-mode .btn{
    color:white
}
.light-mode .btn:hover{
    color:#000
}
.dark-mode .btn:hover{
    color:#ffffff
}
.light-mode .btn.btn-link{
    color:#555
}
.light-mode .btn.btn-link:hover{
    color:black
}
.dark-mode .dropdown-divider{
    border-top:1px solid rgba(255,255,255,0.15)
}
.account-action .btn.focus,.account-action .btn:focus{
    outline:0!important;
    box-shadow:none!important
}
.movie-section-title{
    font-size:15pt;
    font-weight:bold;
    display:inline-block
}
.light-mode .movie-section-title{
    color:#555
}
.dark-mode .movie-section-title{
    color:#eeeeee
}
.actor-header-bg{
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    border-radius:5px;
    background-attachment:fixed
}
.movie-header-bg{
    background-repeat:no-repeat;
    background-position:bottom;
    background-size:cover;
    border-radius:5px;
    background-attachment:fixed
}
.actor-header{
    padding-left:255px
}
.movie-header{
    height:330px;
    width:100%;
    position:relative;
    margin-bottom:40px
}
.dark-mode .movie-header{
    background:#000010;
    background:linear-gradient(0deg,#000010 0%,rgba(0,0,0,0) 99%)
}
.light-mode .movie-header{
    background:#ffffff;
    background:linear-gradient(0deg,#ffffff 0%,rgba(0,0,0,0) 99%)
}
.btn-favorite{
    border:1px solid #ccc;
    background:transparent;
    color:pink;
    border-radius:40px;
    min-width:60px;
    min-height:60px;
    text-transform:uppercase
}
.light-mode .movie-title{
    color:black
}
.dark-mode .movie-title{
    color:white
}
.movie-title{
    font-size:20pt;
    text-transform:uppercase;
    position:absolute;
    bottom:43px;
    margin-left:16px;
    font-weight:700
}
.comment-btn{
    height:60px;
    width:60px;
    background:#ffa501;
    border-radius:70px;
    position:fixed;
    box-shadow:inset 0 1px 0 #ffa501,0 0px 10px #ffa501!important;
    right:20px;
    bottom:20px;
    border:none;
    z-index:10;
    font-size:17pt;
    color:white
}
.light-mode .movie-infos a{
    color:#333!important
}
.dark-mode .movie-infos a{
    color:#b3b3b3!important
}
.dark-mode .movie-infos{
    color:#b3b3b3!important
}
.light-mode .movie-infos{
    color:#333!important
}
.movie-infos{
    font-size:11pt;
    position:absolute;
    bottom:10px;
    margin-left:17px;
    font-weight:700
}
.header-ratings{
    position:absolute;
    right:20px;
    bottom:10px;
    font-size:12pt;
    font-weight:700
}
.dark-mode .header-ratings{
    color:#b3b3b3
}
.light-mode .header-ratings{
    color:#555
}
.imdb{
    background:#ffa501;
    border-radius:5px;
    padding-left:5px;
    padding-right:5px;
    color:black;
    font-size:12pt;
    padding-top:0px;
    font-weight:900;
    margin-left:4px;
    padding-bottom:1px;
    padding-top:1px
}
.header-buttons{
    position:absolute;
    right:20px;
    bottom:47px
}
.dark-mode .header-buttons>button:hover{
    background:#ffffff40
}
.light-mode .header-buttons>button:hover{
    background:#00000040
}
.header-buttons>button{
    height:50px;
    border-radius:50px;
    height:50px;
    width:50px;
    background:transparent
}
.dark-mode .header-buttons>button{
    border:1px solid #ccc;
    color:#ccc
}
.light-mode .header-buttons>button{
    border:1px solid black;
    color:black
}
.checked{
    color:orange
}
.header-buttons>button:last-child>i{
    margin-right:10px
}
.header-buttons>button:last-child{
    position:relative;
    padding-right:28px;
    padding-left:28px;
    width:auto
}
.comment-section{
    margin-top:20px;
    max-height:600px;
    overflow:auto;
    overflow-x:hidden
}
.comment-btn-item{
    width:100%;
    padding:15px;
    font-size:14pt;
    border-radius:2px;
    margin-top:10px;
    border:none
}
.dark-mode .comment-btn-item{
    background:#0e0e1b;
    color:#b3b3b3
}
.light-mode .comment-btn-item{
    background:#dfdfdf;
    color:#555
}
.padding-top-20{
    padding-top:20px
}
.comment-item{
    margin-top:10px;
    padding:20px;
    padding-bottom:5px;
    border-radius:2px
}
.light-mode .comment-item{
    background:#dfdfdf
}
.dark-mode .comment-item{
    background:#0e0e1b
}
.comment-item .comment-text{
    margin-left:55px
}
.comment-item .comment-text a{
    color:#ffa501!important;
    font-weight:bold;
    margin-right:5px;
    transition:color .15s ease-in-out;
    -moz-transition:color .15s ease-in-out;
    -webkit-transition:color .15s ease-in-out
}
.comment-item .avatar-thumb{
    width:40px;
    height:40px;
    display:block;
    float:left
}
.comment-item img{
    height:40px;
    width:40px;
    border-radius:150px;
    -webkit-border-radius:150px;
    -moz-border-radius:150px
}
.comment-item .comment-text p{
    margin-top:5px;
    font-size:11pt
}
.comment-item .comment-text span{
    font-size:10pt;
    color:#616161
}
.review{
    margin-bottom:10px;
    margin-top:10px;
    padding:10px;
    border-radius:2px
}
.dark-mode .review{
    border:1px solid #11141c
}
.light-mode .review{
    border:1px solid #e1e1e1
}
.review .review-properties .review-author{
    font-weight:600
}
.dark-mode .review .review-properties .review-author{
    color:#eeeeee
}
.light-mode .review .review-properties .review-author{
    color:#333
}
.review p{
    font-size:11pt
}
.review .review-properties{
    font-size:12pt;
    color:#676767
}
.review .review-rating{
    color:#ffa501;
    font-weight:800
}
.play-btn{
    text-align:left;
    margin-bottom:10px
}
.dark-mode .play-btn:hover,.dark-mode .episode-btn:hover{
    background:#ffffff40
}
.light-mode .play-btn:hover,.episode-btn:hover{
    background:#00000040
}
.play-btn span{
    margin-right:6px
}
.play-btn,.episode-btn{
    margin-right:5px;
    font-weight:bold;
    border:none;
    padding:15px
}
.dark-mode .play-btn,.dark-mode .episode-btn{
    background:#ffffff20;
    color:#b3b3b3!important
}
.light-mode .play-btn,.light-mode .episode-btn{
    background:#00000020;
    color:#333!important
}
.episode .episode-btn{
    background:#ffffff20!important;
    color:#b3b3b3!important
}
.episode-btn{
    padding:10px;
    position:absolute;
    z-index:10;
    left:10px;
    top:10px
}
.episode-btn:last-child{
    left:50px
}
.season-dropdown > .btn{
    font-weight:700;
    border-radius:0px;
    background:transparent
}
.light-mode .season-dropdown > .btn{
    border:1px solid #333;
    color:#333
}
.dark-mode .season-dropdown > .btn{
    border:1px solid white;
    color:white
}
.season-dropdown .dropdown-menu{
    border-radius:0px;
    max-height:400px;
    overflow:auto
}
.dark-mode .dropdown-menu{
    background-color:#00000f!important;
    border:1px solid rgba(255,255,255,0.15)
}
.dropdown-login{
    transform:translate3d(0px,50px,0px)!important
}
.dark-mode .dropdown-item{
    color:#b3b3b3!important
}
.dark-mode .dropdown-divider{
    border-top:1px solid rgba(255,255,255,0.15)
}
.season-dropdown .dropdown-menu .dropdown-item{
    padding-top:10px;
    padding-bottom:10px
}
.background-close{
    position:fixed;
    top:0px;
    bottom:0px;
    left:0px;
    right:0px;
    z-index:1005;
    display:none
}
.dark-mode .background-close{
    background:#ffffff20
}
.light-mode .background-close{
    background:#00000060
}
.login-box p{
    text-align:left
}
.login-box form{
    width:100%
}
.dark-mode .login-box li{
    text-align:left;
    color:#ffa501
}
.btn-facebook{
    background:#3b5998;
    color:white!important
}
.btn-facebook:hover{
    background:#2b509c;
    color:white!important
}
.btn-link{
    text-decoration:none
}
.icon {
    font-size: 3.0rem;
}
.btn--secondary {
    background: linear-gradient(345deg, rgb(73, 12, 176) 0%, rgb(155, 52, 239) 33%, rgba(255, 255, 255, 0) 66%, rgba(255, 255, 255, 0) 100%) 99% 50% / 400% 400%;
    border: 2px solid transparent;
    color: rgb(255, 255, 255);
    overflow: hidden;
    transition: all 0.5s ease 0s !important;
}
.btn--secondary:hover {
    background-position: 1% 50%;
    -webkit-transition: all 0.5s !important;
    transition: all 0.5s !important;
    border: 2px solid #c600ff;
    color: #fff;
}

.btn--tertiary {
    background-color: rgb(181, 53, 246);
    color: rgb(255, 255, 255);
    border: 2px solid transparent;
    overflow: hidden;
    transition: all 0.5s ease 0s !important;
}
.btn--tertiary:hover {
    background: #fff;
    color: #000;
    border: 2px solid transparent;
    overflow: hidden;
    transition: all 0.5s ease 0s !important;

}


.rounded-pill {
    border-radius: 50rem!important;
}
.default-plan::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 8px;
    padding: 2px;
    background: linear-gradient(0deg, #5b16bd, #b908f6);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
}

.plan-container .plan-body {
    padding: 25px;
    display: flex;
    border-radius: 8px;
    height: 100%;
    flex-direction: column;
    justify-content: space-between;
    text-align: center;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0) 100%);
}
.default-plan_::before {
    content: "AHORRA 3 MESES";
    position: absolute;
    width: 215px;
    height: 30px;
    top: -2px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    z-index: 1;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-weight: 700;
    padding: 2px;
    font-size: 16px;
    letter-spacing: 0.1em;
    border-radius: 50px;
    background: linear-gradient(46deg, #5b16bd, #b908f6);
}

.plan-cta-a:hover {
    background-position: 1% 50%;
    -webkit-transition: all 0.5s !important;
    transition: all 0.5s !important;
    border: 2px solid #c600ff;
    color: #fff;
}

.plan-cta-a {
    background: linear-gradient(345deg, #490cb0 0%, #9b34ef 33%, rgba(255, 255, 255, 0) 66%, rgba(255, 255, 255, 0) 100%);
    border-radius: 67.2055px;
    letter-spacing: 1.37994px;
    text-transform: uppercase;
    color: #ffffff;
    max-width: 337px;
    line-height: 36px;
    display: inline-block;
    text-align: center;
    font-size: 15.1793px;
    width: 100%;
    background-position: 99% 50%;
    background-size: 400% 400%;
    border: 2px solid transparent;
    overflow: hidden;
    -webkit-transition: all 0.5s !important;
    transition: all 0.5s !important;
    font-weight: 700;
}

.btn-primary{
    background: #ed0ec8;
    color: #fff!important;
    opacity:0.8;
    border: 1px solid #ed0ec8;
}

.btn-primary-old{
    background:transparent;
    color:#ffb021!important;
    opacity:0.8;
    border:1px solid #ffb021
}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active{
    opacity:1!important;
    color:#ffb021!important;
    background:transparent!important;
    border:1px solid #ffb021!important
}
.btn-stream{
    background:transparent;
    color:#a34df4!important;
    opacity:0.8;
    border:1px solid #a34df4
}
.btn-stream:hover,.btn-stream:focus,.btn-stream:active{
    opacity:1!important;
    color:#a34df4!important;
    background:transparent!important;
    border:1px solid #a34df4!important
}
.btn-google{
    background:#db4a39;
    color:white!important
}
.btn-google:hover{
    background:#ca3726;
    color:white!important
}
.login-box{
    position:fixed;
    width:400px;
    max-width:90%;
    z-index:1001;
    top:80px;
    box-shadow:0px 0px 25px -8px #000;
    border-radius:5px;
    overflow:hidden;
    left:50%;
    transform:translateX(-50%);
    display:block
}
.light-mode .login-box{
    background:#ffffff
}
.dark-mode .login-box{
    background:#000010
}
.login-box .notif-head{
    height:60px
}
.dark-mode .login-box .notif-head{
    background:#0a111d
}
.light-mode .login-box .notif-head{
    background:#eee
}
.login-box .notif-close{
    height:60px;
    line-height:60px;
    width:60px
}
.notif-close{
    display:inline-table;
    line-height:50px;
    text-align:center;
    color:white;
    cursor:pointer;
    position:absolute;
    background-color:#ffa501
}
.login-box .notif-title{
    height:60px;
    line-height:60px
}
.notif-title{
    width:100%;
    display:inline-table;
    height:50px;
    line-height:50px;
    text-align:center;
    color:white;
    font-size:14pt
}
.dark-mode .notif-title{
    color:white
}
.light-mode .notif-title{
    color:black
}
.notif{
    position:fixed;
    z-index:10000;
    min-width:318px;
    top:70px;
    left:20px;
    display:none;
    background:#182838;
    border-radius:2px;
    height:45px;
    box-shadow:0px 0px 3px #1e2c49;
    padding-right:10px
}
.notif button{
    background:#8a40ac;
    border:none;
    color:white;
    height:45px;
    width:45px;
    font-size:16pt;
    float:left
}
.notif>p{
    line-height:45px;
    padding-left:60px
}
.dark-mode .notif>p{
    color:white
}
.light-mode .notif>p{
    color:black
}
.remember-me{
    line-height:2.5em;
    height:40px
}
.dark-mode .remember-me{
    color:#fbfbfb!important
}
.light-mode .remember-me{
    color:black!important
}
.heada__subtitle,.heada__title{
    margin:0;
    padding:7px
}
.pdn--al{
    padding:20px;
    padding-bottom:10px
}
.carda__body>.row{
    margin-right:0px;
    margin-left:0px
}
.mrg--vh{
    margin-top:15px;
    margin-bottom:10px
}
.mrg--vh{
    margin-top:15px;
    margin-bottom:10px
}
.dividr{
    height:1px;
    margin:0 auto 14px;
    width:50%
}
.dark-mode .dividr{
    color:white;
    background:#ccd0d2
}
.light-mode .dividr{
    color:black;
    background:black
}
.dividr__content{
    display:block;
    width:3.5em;
    height:1px;
    margin:0 auto;
    position:relative
}
.dark-mode .dividr__content{
    background:#00000f
}
.light-mode .dividr__content{
    background:white
}
.dividr__content--icon:before,.dividr__label{
    line-height:1px;
    width:100%;
    position:absolute;
    text-align:center;
    font-weight:600;
    top:-50%;
    left:0;
    font-size:12pt
}
.mrg--bs{
    position:relative;
    min-height:1px;
    padding-right:2px;
    padding-left:2px
}
.mrg--bs{
    margin-bottom:20px
}
.pdn--at{
    padding:7px
}
.brd--b,.brd--b-imp{
    border:0 solid #eaeaea;
    border-bottom-width:1px;
    color:#fbfbfb!important
}
.pdn--at li a{
    color:white!important
}
.pdn--at li a:hover{
    background:#192837!important
}
.carda__body input.form-control[type="text"],.carda__body input.form-control[type="password"],.carda__body input.form-control[type="email"]{
    height:40px;
    font-weight:bold
}
.dark-mode .form-group .form-control,.dark-mode .carda__body input.form-control[type="text"],.dark-mode .carda__body input.form-control[type="password"],.dark-mode .carda__body input.form-control[type="email"]{
    background-color:#0a101d;
    border:1px solid #121b2f;
    color:white
}
.light-mode .form-group .form-control,.light-mode .form-control,.light-mode .form-control:focus,.light-mode input.form-control[type="text"],.light-mode input.form-control[type="password"],.light-mode input.form-control[type="email"]{
    background-color:#f1efef;
    border:1px solid #dedede;
    color:black
}
.label-one{
    color:#a8aeb8;
    background-color:#1f2d48ff;
    border:1px solid #1f2d48ff;
    height:45px;
    color:white;
    font-weight:bold
}
.dark-mode .control-one{
    color:white
}
.light-mode .control-one{
    color:black
}
span.control-one{
    border-right:1px solid #141d26;
    padding-right:5px;
    background:#1a2438
}
.dropdown-login i.fas{
    margin-right:10px
}
.dropdown-login .dropdown-item{
    padding:.55rem 1.5rem;
    text-transform:uppercase;
    font-size:11pt
}
.dropdown-login{
    right:0px!important;
    left:auto!important;
    border-radius:0px
}
.ads-element img{
    width:100%
}
.login-page-bg{
    width:100%;
    height:100%;
    background-image:url("/web/img/background.jpg");
    background-repeat:no-repeat;
    background-position:center;
    background-attachment:fixed;
    background-size:cover
}
.login-page-bg-blur{
    height:100%;
    width:100%;
    position:fixed;
    top:0px
}
.dark-mode .login-page-bg-blur{
    background:#000000ad
}
.light-mode .login-page-bg-blur{
    background:#ffffffad
}
.login-page-content>.login-box{
    position:relative!important;
    width:435px;
    top:0px
}
.login-page-content{
    padding-left:70px;
    padding-right:70px;
    position:fixed;
    right:0px;
    top:0px;
    height:100%;
    text-align:center;
    width:550px;
    overflow:auto
}
.dark-mode .login-page-content{
    background:#0a101d
}
.light-mode .login-page-content{
    background:white
}
.login-page-content>img{
    width:200px;
    margin:25px
}
.serie-episodes-loading{
    height:200px;
    width:100%;
    display:none;
    line-height:200px;
    height:200px;
    width:100%;
    text-align:center;
    font-size:32pt
}
.dark-mode .serie-episodes-loading{
    color:white
}
.light-mode .serie-episodes-loading{
    color:black
}
.comment-write{
    padding-bottom:45px
}
.comment-write .comment-text a{
    height:35px;
    display:block
}
.comment-text textarea,.review-write textarea{
    width:100%;
    border:1px solid #555;
    margin-top:0px;
    margin-bottom:0px;
    height:93px;
    padding:10px;
    min-height:100px;
    border-radius:5px
}
.dark-mode .comment-text textarea,.dark-mode .review-write textarea{
    background:rgb(0,0,15);
    color:#ccc
}
.light-mode .comment-text textarea,.light-mode .review-write textarea{
    background:#eee;
    color:#555
}
.success-comment,.error-comment{
    margin-top:15px
}
.loading-comment,.success-comment,.error-comment,.success-review,.error-review,.loading-review{
    display:none
}
.review-properties .float-right{
    font-size:10pt
}
.review-write{
    padding:10px;
    background-color:transparent;
    margin:0px
}
.rate{
    float:left;
    padding:0 10px
}
.rate:not(:checked) > input{
    position:absolute;
    display:none
}
.rate:not(:checked) > label{
    float:right;
    width:1em;
    overflow:hidden;
    white-space:nowrap;
    cursor:pointer;
    font-size:30px;
    color:#ccc
}
.rate:not(:checked) > label:before{
    content:'★ '
}
.rate > input:checked ~ label{
    color:#ffc700
}
.rate:not(:checked) > label:hover,.rate:not(:checked) > label:hover ~ label{
    color:#deb217
}
.rate > input:checked + label:hover,.rate > input:checked + label:hover ~ label,.rate > input:checked ~ label:hover,.rate > input:checked ~ label:hover ~ label,.rate > label:hover ~ input:checked ~ label{
    color:#c59b08
}
.subtitles-table img,.downloads-table img{
    height:25px;
    width:auto
}
.dark-mode .subtitles-table td,.dark-mode .downloads-table td,.dark-mode .subtitles-table th,.dark-mode .downloads-table th{
    border-top:1px solid #dee2e630!important
}
.dark-mode .downloads-table thead th,.dark-mode .downloads-table thead th{
    border-bottom:2px solid #dee2e630!important
}
.trailer-video{
    position:fixed;
    left:0px;
    right:0px;
    width:100%;
    height:100%;
    top:0px;
    bottom:0px;
    z-index:2000;
    display:none
}
.dark-mode .trailer-video{
    background:rgba(255,255,255,0.2)
}
.light-mode .trailer-video{
    background:rgba(0,0,0,0.5)
}
.trailer-video>div{
    margin:auto;
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:10;
    width:560px;
    height:310px
}
.share-buttons{
    position:absolute;
    font-size:36pt;
    top:55px;
    left:0px;
    z-index:10;
    display:none
}
.dark-mode .share-buttons a:hover{
    background-color:white;
    color:black
}
.light-mode .share-buttons a:hover{
    background-color:#000000;
    color:white
}
.light-mode .share-buttons a{
    background:white;
    color:black;
    border:1px solid black
}
.dark-mode .share-buttons a{
    background:black;
    color:white;
    border:1px solid white
}
.share-buttons a{
    font-size:20pt;
    display:inline-block;
    display:inherit;
    line-height:50px;
    background:black;
    margin-top:5px;
    border-radius:100px;
    height:50px;
    width:50px;
    text-align:center;
    color:white;
    border:1px solid white
}
.dark-mode .table{
    color:#ffffff!important
}
.channel-logo{
    position:absolute;
    width:300px;
    margin-left:50%;
    left:-150px;
    top:50px;
    border-radius:5px;
    box-shadow:0px 0px 10px black
}
img.country-logo{
    height:20px;
    border-radius:2px;
    margin-right:10px
}
.actor-logo{
    position:absolute;
    margin-left:40px;
    width:200px;
    top:100px;
    border-radius:5px
}
.dark-mode .actor-logo{
    box-shadow:0px 0px 10px black
}
.light-mode .actor-logo{
    box-shadow:0px 0px 5px 2px #4a4a4a59
}
.serie-dialog>.login-box{
    width:700px!important
}
.downloads-table .table{
    margin-bottom:0rem!important
}
.poster.col-4 img,.poster.col-md-2 img{
    width:100%!important
}
.posterhome.col-4 img,.posterhome.col-md-2 img{
    width:100%!important
}
.channel.col-md-2 img,.channel.col-4 img{
    width:100%!important
}
.channel.col-md-2,.channel.col-4{
    margin-bottom:0px;
    margin-top:0px
}
.filter-section{
    width:100%;
    position:relative;
    padding-left:10px;
    padding-right:10px
}
.dark-mode .season-dropdown .btn-secondary:hover,.dark-mode .season-dropdown .btn-secondary.active,.dark-mode .season-dropdown .btn-secondary:focus,.dark-mode .season-dropdown .btn-secondary:active{
    background:white!important;
    border-color:white!important;
    color:black!important
}
.dark-mode .pagination>span>a{
    color:white;
    border:1px solid white
}
.light-mode .season-dropdown .btn-secondary:hover,.light-mode .season-dropdown .btn-secondary.active,.light-mode .season-dropdown .btn-secondary:focus,.light-mode .season-dropdown .btn-secondary:active{
    background:black!important;
    border-color:black!important;
    color:white!important
}
.light-mode .pagination>span>a{
    border:1px solid black;
    color:black
}
.pagination>span>a{
    display:inline-block;
    height:45px;
    background:transparent;
    margin:2px;
    min-width:45px;
    line-height:45px;
    text-align:center;
    font-size:10pt;
    font-weight:bold;
    text-decoration:none
}
.dark-mode .pagination>span>a:hover{
    background:white;
    color:black
}
.light-mode .pagination>span>a:hover{
    background:black;
    color:white
}
.pagination>span.current{
    display:inline-block;
    height:45px;
    margin:2px;
    min-width:45px;
    line-height:45px;
    text-align:center;
    font-size:10pt;
    font-weight:bold
}
.light-mode .pagination>span.current{
    background:black;
    border:1px solid white;
    color:white!important
}
.dark-mode .pagination>span.current{
    background:white;
    border:1px solid white;
    color:black!important
}
#lightmode{
    right:-20px;
    height:40px;
    width:40px;
    background:white;
    border-radius:20px;
    color:black;
    text-align:center;
    line-height:40px;
    font-size:20pt;
    position:absolute
}
#darkmode{
    right:-20px;
    height:40px;
    width:40px;
    background:black;
    border-radius:20px;
    color:white;
    text-align:center;
    line-height:40px;
    font-size:20pt;
    position:absolute
}
.login-page-content #darkmode,.login-page-content #lightmode{
    left:20px;
    bottom:20px;
    position:fixed
}
.login-icon{
    font-size:60pt;
    color:#b3b3b3;
    margin:18px
}
.pack input,.payment input{
    display:none
}
.pack,.payment{
    cursor:pointer;
    padding:1px;
    margin-top:10px;
    border-radius:7px;
    margin-bottom:20px;
    display:block
}
.dark-mode .pack,.dark-mode .payment{
    border:1px solid #0a101d;
    box-shadow:0px 0px 10px 0px #0a101d;
    background:white
}
.light-mode .pack,.light-mode .payment{
    border:1px solid white;
    box-shadow:0px 0px 10px 0px #ccc
}
.payment .fa-check{
    position:absolute;
    right:20px;
    top:25px
}
.dark-mode .payment .fa-check{
    color:#0a101d
}
.light-mode .payment .fa-check{
    color:white
}
.pack>div,.payment>div{
    display:block;
    padding:20px;
    padding-bottom:10px;
    text-align:left;
    position:relative;
    border-radius:5px;
    width:100%;
    min-height:65px
}
.dark-mode .pack>div,.dark-mode .payment>div{
    background:#0a101d;
    color:white;
    border:1px solid #0a101d
}
.light-mode .pack>div,.light-mode .payment>div{
    background:white;
    border:1px solid black;
    color:black
}
.dark-mode .pack h5,.dark-mode .payment h5{
    color:white
}
.light-mode .pack h5,.light-mode .payment h5{
    color:black
}
.pack h4,.payment h4{
    width:auto;
    display:inline-block;
    font-size:11pt;
    font-weight:600
}
.dark-mode .pack h4,.dark-mode .payment h4{
    ;
    color:#eee
}
.light-mode .pack h4,.light-mode .payment h4{
    color:#555
}
.pack span,.payment span{
    position:absolute;
    right:11px;
    z-index:10;
    top:15px;
    font-size:16pt;
    font-weight:bold
}
.dark-mode .pack span,.dark-mode .payment span{
    color:white
}
.light-mode .pack span,.light-mode .payment span{
    color:black
}
.pack p,.payment p{
    position:absolute;
    right:10px;
    border-radius:5px;
    background:white;
    padding:5px 10px 5px 10px;
    font-size:10pt;
    top:-17px;
    font-weight:700;
    color:white!important;
    box-shadow:0px 0px 3px -2px black;
    background-color:#ffa502
}
.payment.active i{
    color:white
}
.pack.active,.payment.active{
    color:white;
    border:1px solid #ffa501;
    box-shadow:0px 0px 10px 0px #ffa501
}
.pack.active>div p,.payment.active>div p{
    color:#ffa502!important;
    background-color:white
}
.pack.active h4,.payment.active h4{
    color:#eee
}
.pack.active h5,.pack.active span,.payment.active h5{
    color:white
}
.pack.active>div,.payment.active>div{
    background:#ffa501;
    border:4px solid #ffa501
}
.subscribe-title{
    margin-bottom:10px;
    text-align:left
}
.dark-mode .subscribe-title{
    color:white
}
.dark-mode .subscribe-title{
    color:black
}
.subscribe-title span{
    font-weight:bold;
    background:white;
    height:25px;
    min-width:25px;
    display:inline-block;
    border-radius:5px;
    color:black;
    text-align:center;
    font-size:10pt;
    line-height:25px;
    margin-right:10px;
    margin-bottom:0px;
    padding-left:7px;
    padding-right:7px;
    margin-top:17px
}
.dark-mode .subscribe-title span{
    color:black;
    background:white
}
.light-mode .subscribe-title span{
    background:black;
    color:white
}
.subscribe-title h5{
    line-height:41px;
    font-size:13pt;
    line-height:25px;
    display:inline-block;
    margin-bottom:0px;
    margin:0px;
    padding:0px;
    margin-top:10px
}
.dark-mode .subscribe-title h5{
    color:white
}
.light-mode .subscribe-title h5{
    color:black
}
#payment-method{
    display:none
}
.error-plan,.error-method{
    display:none;
    color:red!important;
    text-align:left
}
.validate-input{
    color:red!important
}
.paypal-redirect{
    margin-top:50px;
    display:inline-block;
    text-align:center
}
.paypal-redirect p{
    font-size:11pt;
    color:#3b7bbf!important;
    font-weight:bold
}
.paypal-redirect>i{
    font-size:47pt;
    margin:23pt;
    color:#3b7bbf
}
.paypal-redirect>i{
    font-size:47pt;
    margin:23pt;
    color:#3b7bbf
}
#subscribe-plan{
    text-align:left;
    color:#eee
}
.dark-mode .file-input{
    border:2px dashed darkgrey;
    color:darkgrey
}
.light-mode .file-input{
    border:2px dashed gray;
    color:gray
}
.file-input{
    text-align:center;
    border-radius:5px;
    padding:10px;
    cursor:pointer;
    margin-bottom:10px;
    font-size:10pt
}
.file-input.active{
    border:2px dashed #4CAF50;
    color:#4CAF50
}
.file-input .message-before,.file-input.active .message-after{
    display:block
}
.file-input .message-after,input[type="file"],.file-input.active .message-before{
    display:none
}
.StripeElement{
    padding:8px 12px;
    border-radius:4px;
    border:1px solid transparent;
    -webkit-transition:box-shadow 150ms ease;
    transition:box-shadow 150ms ease;
    display:block;
    width:100%
}
.dark-mode .StripeElement{
    background-color:#0a101d;
    box-shadow:0 1px 3px 0 #e6ebf1
}
.light-mode .StripeElement{
    background-color:#eee;
    box-shadow:0 1px 3px 0 #e6ebf1
}
.StripeElement--focus{
    box-shadow:0 1px 3px 0 #cfd7df
}
.StripeElement--invalid{
    border-color:#fa755a
}
.StripeElement--webkit-autofill{
    background-color:#fefde5!important
}
.alert-card{
    display:none
}
.banque-account{
    padding:10px;
    border-radius:5px;
    font-size:10pt;
    font-style:italic
}
.dark-mode .banque-account{
    background:black;
    color:white!important
}
.light-mode .banque-account{
    background:#eee;
    color:black!important
}
.empty-box img{
    width:420px;
    padding:20px;
    margin-bottom:50px
}
.empty-box{
    width:100%;
    text-align:center;
    padding:100px
}
.menu-left-btn{
    display:none!important
}
.xs-header{
    display:none
}
.for-phone{
    display:none
}
.top-nav .dropdown-toggle span{
    display:inline-block;
    height:36px;
    line-height:36px;
    float:left;
    padding-left:5px;
    padding-right:5px
}
.xs-header .dropdown-toggle,.top-nav .dropdown-toggle{
    padding:0px;
    padding-right:10px
}
.xs-header .dropdown-toggle img,.top-nav .dropdown-toggle img{
    margin-right:10px;
    height:36px
}
.gplay-box{
    padding:5px;
    border:1px solid #ffa502;
    height:90px;
    position:fixed;
    right:12px;
    bottom:12px;
    border-radius:5px;
    text-align:initial;
    z-index:1004;
    display:none
}
.dark-mode .gplay-box{
    background:#000000e6;
    color:white
}
.light-mode .gplay-box{
    background:#FFFFFFe6;
    color:white
}
.gplay-box>span{
    color:#ffa502;
    font-size:12pt;
    position:absolute;
    right:5px;
    top:5px;
    cursor:pointer
}
.gplay-box>a{
    background:#ffa502;
    color:white!important;
    right:20px;
    top:25px;
    position:absolute
}
.gplay-box>div{
    width:320px;
    margin-right:140px
}
.gplay-box>div>img{
    height:78px;
    width:78px;
    border-radius:5px;
    float:left;
    margin-right:10px
}
.gplay-box>div>h3{
    font-size:16pt;
    padding-top:5px
}
.gplay-box>div>p{
    font-size:10pt
}
.alert-home{
    background:#ffa502;
    border-color:white;
    color:white;
    position:fixed;
    z-index:10001;
    right:25px;
    top:19px;
    box-shadow:0px 0px 5px 2px #ffa502
}
.alert-home>button{
    margin-left:14px;
    font-size:15pt;
    color:white;
    line-height:25px
}
@media (max-width:768px){
    .carousel-item .carousel-detail p{
        display:none
    }
    .menu-left-btn{
        display:block!important
    }
    .active-sidebar{
        left:0px!important;
        transition:0.2s
    }
    .sidebar{
        position:fixed;
        width:250px;
        left:-250px;
        transition:0.2s
    }
    .carousel-item .carousel-detail{
        width:100%!important
    }
    .xs-header{
        display:block
    }
    .img-fluid{
        max-width:100%!important;
        width:100%!important;
        margin-right:0px!important
    }
    .carousel-item .carousel-detail h3{
        font-size:14pt
    }
    .carousel-item .carousel-detail button{
        bottom:-38px;
        right:-10px;
        color:#ffa501!important;
        background-color:transparent!important;
        box-shadow:none!important;
        font-size:18pt
    }
    .carousel-item .carousel-detail button span{
        display:none
    }
    .xs-header>img{
        height:38px;
        margin-top:12px
    }
    .xs-header button{
        margin-top:12px;
        margin-right:5px
    }
    .xs-header{
        height:50px;
        padding:0px 15px 0px 15px
    }
    .for-phone{
        display:block
    }
    .for-desktop{
        display:none
    }
    .top-nav{
        padding-top:0px;
        padding-bottom:0px
    }
    .content-section{
        padding-top:10px;
        padding-left:0px;
        padding-right:0px
    }
    .search-form{
        position:fixed;
        padding-top:10px;
        padding-bottom:10px;
        left:0px;
        right:0px;
        top:0px;
        z-index:15;
        display:none
    }
    .light-mode .search-form{
        background:white;
        border-bottom:1px solid #ccc
    }
    .dark-mode .search-form{
        background:#000010;
        border-bottom:1px solid #333
    }
    .movie-title{
        font-size:15pt;
        bottom:65px
    }
    .actor-header .movie-title{
        bottom:80px
    }
    .movie-infos{
        bottom:25px
    }
    .header-buttons{
        right:20px;
        bottom:100px
    }
    .header-ratings{
        left:17px;
        bottom:0px
    }
    .page-header{
        position:relative
    }
    .page-header .menu-left-btn{
        position:absolute;
        left:5px;
        top:5px;
        border-radius:20px
    }
    #darkmode,#lightmode{
        right:-50px!important
    }
    .login-page-content #darkmode,.login-page-content #lightmode{
        z-index:1020
    }
    .channel img{
        width:120px!important;
        min-height:auto!important;
        height:auto
    }
    .poster img{
        width:120px!important;
        min-height:auto!important
    }
    .posterhome img{
        width:120px!important;
        min-height:auto!important
    }
    .poster>div>div{
        font-size:7pt!important
    }
    .poster{
        padding:5px;
        margin-bottom:0px;
        margin-top:2px
    }
    .channel{
        padding:3px;
        margin-bottom:2px;
        margin-top:2px
    }
    .tab-title{
        margin-top:15px
    }
    .search-form form{
        width:calc(100% - 54px);
        display:inline-block
    }
    .login-page-content{
        width:100%;
        padding-left:20px;
        padding-right:20px;
        background:transparent
    }
    .actor-logo{
        top:200px;
        width:120px
    }
    .actor-header{
        padding-left:160px!important;
        top:45px!important
    }
    .channel-logo{
        width:200px;
        left:-100px;
        top:20px
    }
    .trailer-video>div{
        width:calc(100% - 20px);
        height:310px
    }
    .gplay-box{
        left:12px;
        width:calc(100% - 24px)
    }
    .main{
        width:100%
    }
}
@media (min-width:1700px){
    .col-xxl-5{
        -ms-flex:0 0 40%;
        flex:0 0 40%;
        max-width:40%
    }
    .col-xxl-2{
        -ms-flex:0 0 20%;
        flex:0 0 20%;
        max-width:20%
    }
    .poster img{
        width:190px!important
    }
    .posterhome img{
        width:390px!important
    }
    .channel img{
        width:200px!important
    }
    .actor{
        margin-right:30px
    }
    .actor img{
        height:85px;
        width:85px;
        margin-bottom:15px
    }
    .actor-large img{
        height:auto;
        width:100%
    }
    .actor-large{
        margin-right:0px
    }
}
.close-menu-left-btn{
    z-index:12;
    width:100%;
    height:100%;
    position:fixed;
    top:0px;
    left:0px;
    right:0px;
    border:0px;
    border:none;
    display:none;
    background:#1010108a
}
.float-right {
    float: right !important;
}

.shadow-custom {
    box-shadow:0 0 1rem #a34df4 !important;
   }