@media only screen and (max-width: 1680px) {
        body{
            font-family: 'Lato', sans-serif;
            position: relative;
            overflow: hidden;
            max-width: 1920px;
            margin: 0 auto;
            color:#fff;
            background: #1e1e1e;
        }

        @-webkit-keyframes rotation {
            from {
                -webkit-transform: rotate(0deg);
            }
            to {
                -webkit-transform: rotate(360deg);
            }
        }

        .height-100 {
            height: 100vh;
        }
        ::-webkit-scrollbar-corner {
            background-color: transparent;
        }
        ::-webkit-scrollbar {
            width:0px;
            height: 0px;
        }
        ::-webkit-scrollbar-track{
            background: rgba(187, 177, 177, 0.5);
        }


        .hide{
            display: none !important;
        }
        .has-vertical-scroll::-webkit-scrollbar {
            width:14px;
            overflow-y:scroll;
        }
        ::-webkit-scrollbar-thumb {
            background: #8584da;
            border-radius: 10px;
            box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0.05), inset 1px 1px 0px rgba(0, 0, 0, 0.05);
        }


        .category-search-wrapper{
            background: #1B1B1B;
            position: relative;
            padding-left: 50px;
            border:2px solid transparent;
        }
        .category-search-wrapper.active{
            border-color: #fff;
        }
        .category-search-icon {
            position: absolute;
            left: 10px;
            height: 30px;
            top: 30%;
        }
        .category-search-input {
            background: transparent;
            font-size: 25px;
            width: 100%;
            border: none !important;
            padding: 15px 0;
            color: #fff;
            font-weight: normal;
            letter-spacing: 1px;
            outline:none !important;
        }


        .category-item-container {
            font-size: 22px;
            color: #fff;
        }
        .category-item-wrapper{
            white-space: nowrap;
            transition: all 0.03s;
            padding: 10px 10px 10px 30px;
            border-bottom: 1px solid #424040;
        }
        .category-item-container:last-child .category-item-wrapper{
            border-bottom: none;
        }
        .category-item-name {
            display: inline-block;
            width: 73%;
            vertical-align: middle;
            overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
        }
        .category-movies-count {
            display: inline-block;
            width: 30%;
            text-align: center;
            font-weight: normal;
        }
        .category-item-wrapper.active{
            background:#006172;
        }

        .video-skin{
            position: absolute;
            left:0;
            bottom:0;
            color:#fff;
            width:100%;
            background: #333;
            padding: 10px 0;
            padding-top: 0;
        }
        .video-progress{
            height: 10px;
            overflow: hidden;
            font-size: .75rem;
            background-color: #e9ecef;
        }
        .progress-amount{
            background: #dd0000;
            height: 100px;
            display: inline-block;
        }
        .time-info {
            padding-top: 10px;
            padding-left: 10px;
        }
        .video-loader{
            position:absolute;
            left:0;
            top:0;
            width:100%;
            height: 100%;
            color: #ff4832;
            font-size:25px;
            display:none;
            text-align: center;
        }
        .video-loader img{
            width: 90px;
            height: 90px;
            position: relative;
            top: 32%;
        }
        .video-error{
            position: absolute;
            left:0;
            top:0;
            width:100%;
            height: 100%;
            color: #fff;
            font-size:25px;
            display:none;
            text-align: center;
            background: #111;
        }
        .video-error-text{
            font-weight: normal;
        }

        .video-error img {
            width: 100%;
            height: 100%;
        }
        .video-error-text{
            position:relative;
            top:45%;


            white-space: normal;
        }
        .toast{
            position:fixed;
            top:45%;
            left:45%;

            z-index: 9999;
            max-width: none !important;
            display: none;
            box-shadow: none !important;
        }
        .toast-body{
            text-align: center;
        }

        .search-modal-container{
            position: fixed;
            left:0;
            top:0;
            width:100vw;
            height:100vh;
            background: #2222229e;
            display:none;
        }
        .search-modal-wrapper{
            position:fixed;
            width:40vw;
            height: 90vh;
            left:50%;
            top:0;
            transform: translate(-50%, 5vh);
            background: #333;
            padding: 20px 10px;
        }
        .search-input-container{
            font-size: 0;
        }
        #search-value{
            font-size: 25px;
        }
        .search-icon-wrapper{
            color: #eee;
            text-align: right;
            padding: 5px;
            font-size: 25px;
            display: inline-block;
            width: 7%;
        }
        .search-content-container {
            margin-top: 10px;
            height: calc(100vh - 190px);
            overflow-y: scroll;
            padding-bottom: 0;
        }
        .search-item-wrapper {
            color: #ddd;
            font-size: 25px;
            padding: 5px;
            border-bottom: 1px solid #888;
        }
        .search-item-wrapper.active, .search-item-wrapper:hover {
            color: #fff;
            background: #111;
        }

        .favourite-badge {
            position: absolute;
            right: 20px;
            top: 10px;
            font-size: 25px;
            color: yellow;
        }

        .modal-border-1 {
            border: 3px solid #ccc;
        }
        .modal-bg-cyan{
            background: #165a9f !important
        }
        .modal-text-1 {
            font-size: 35px !important;
            color: #eee;
        }
        .modal-btn-1 {
            background: #0f6674 !important;
            padding: 5px 20px !important;
            color: #eee !important;
            font-size: 30px !important;
            border-radius: 10px !important;
            border: 2px solid #ccc !important;
        }
        .modal-btn-1.active {
            border-color: #f1ae0c !important;
            color:#fff !important;
        }

        #app{
            /* background-image: url("../images/black_background.jpg"); */
            background-image: url("../images/dashboard_background.png");
            overflow-y:hidden;
            background-size: 100% 100%;
        }

        #seasons-page-container{
            padding: 30px;
            padding-left: 80px;
            margin-top: 20px;
        }
        #series-image {
            width: 90%;
            max-height:90vh;
        }

        #series-title-container {
            color: #fff;
            margin-bottom: 15px;
        }
        #series-title {
            font-size: 30px;
        }
        #season-rating {
            margin-left: 20px;
            font-size: 25px;
        }
        #season-grid-container{
            height: calc(100vh - 260px);
            padding-top: 15px;
            padding-left:5px;
            padding-bottom:10px;
            overflow-y: hidden;
        }
        .season-grid-item-wrapper, .episode-grid-item-wrapper {
            width: calc(20% - 25px);
            display: inline-block;
            margin-right: 20px;
            border-radius: 10px;
            overflow: hidden;
            height:380px;
            background: #48298f;
            box-shadow: 0 0 5px #633fb5a3;
            transition: all 0.6s;

        }
        .season-grid-item-wrapper.active, .episode-grid-item-wrapper.active{
            background: yellow;
            transform: scale(1.05);
        }
        .season-image, .episode-image {
            width: 100%;
            height: 320px;
            transition: border-color 0.6s;
        }
        .season-grid-item-wrapper.active img, .episode-grid-item-wrapper.active img{
            border-bottom:none;
            border-top-left-radius: 13px;
            border-top-right-radius: 13px;
        }
        .season-title-wrapper, .episode-title-wrapper{
            height: 60px;
            width: 100%;
        }
        .season-title, .episode-title {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            color: #fff;
            width:100%;
            text-align: center;
        }
        .season-grid-item-wrapper.active .season-title, .episode-grid-item-wrapper.active .episode-title{
            color:#333;
        }
        #season-title-container {
            color: #fff;
            font-size: 35px;
            margin: 0 auto;
            margin-top: 80px;
        }


        .padding-0{
            padding: 0 !important;
        }

        .modal-header-bg-img-1{
            background-image: url(../images/dialog_title_bg.png);
            background-size: 100% 100%;
            border-bottom: none !important;
        }
        .modal-body-bg-img-1{
            background-image: url(../images/dialog_bg.png);
            background-size: 100% 100%;
        }
        .modal-title-text-2{
            font-size:35px;
            color:#eee;
            margin:5px auto;
        }
        .modal-title-text-3{
            font-size:35px;
            color:#333;
        }



        .modal-operation-menu-type-1 {
            color: #ddd;
            font-size: 35px;
            text-align: center;
            font-weight: bold;
            padding: 15px 25px;
            border-bottom: 1px solid #bfbf96;
        }
        .modal-operation-menu-type-1.active {
            background: #7f2a2a;
        }
        .modal-body .modal-operation-menu-type-1:last-of-type{
            border-bottom:none !important;
        }

        .modal-operation-menu-type-2 {
            padding: 20px 30px;
        }
        .modal-operation-menu-type-2.active {
            background-color: #ddd;
        }
        .modal-btn-2 {
            font-size: 30px;
            width: 150px;
            background: #fff;
            margin-left: 10px;
            transition: all 0.8s;
        }
        .modal-btn-2.active {
            background: #ddd;
        }

        .modal-operation-menu-type-3{
            color: #ddd;
            font-size: 35px;
            font-weight: bold;
            padding: 15px 25px;
        }
        .modal-operation-menu-type-3.active {
            background: #fff;
            color: #333;
            border-radius: 7px;
        }
        .modal-operation-menu-type-3 i {
            margin-right: 20px;
        }
        .modal-operation-menu-type-3.active i {
            color: #4cc94c;
        }

        .parent-modal-input-item-container {
            font-size: 35px;
            margin-bottom: 10px;
        }
        .parent-modal-label-wrapper{
            color: #fff;
            display: inline-block;
            width: 41%;
            vertical-align: middle;
        }
        .parent-modal-input-wrapper {
            padding-right: 0;
        }
        .parent-modal-input-wrapper input {
            padding: 20px 10px;
            font-size: 30px;
            border: 3px solid #a99e9e;
        }
        .parent-modal-input-wrapper.active input{
            border: 3px solid #e87b0a !important;
        }

        .parent-modal-input-container {
            margin-top:10px;
            margin-bottom: 100px;
        }

        .user-account-item-wrapper.row {
            font-size: 35px;
            color: #f78d0b;
        }
        .no-background{
            background: none !important;
        }
        .active-state{
            background: #c81111;
        }
        .subtitle-container{
            color:#fff;
            font-size:35px;
            font-weight: normal;
            bottom:0;
            padding:30px;
            width:60%;
            left:20%;
        }
        .login-page-link {
            color: #ffff00 !important;
        }

        #sort-modal-container{
            position: fixed;
            left:0;
            top:0;
            width: 100%;
            height: 100%;
            background: #1119;
            display: none;
        }
        #sort-modal-wrapper{
            position: absolute;
            left: 35%;
            top: 150px;
            font-size: 30px;
            border-radius: 5px;
        }


        .video-info-btns-container{
            font-size: 0;
            width: 80%;
            margin: 0 auto;
        }
        .video-info-btn {
            vertical-align: middle;
            display: inline-block;
            text-align: center;
            width: 25%;
        }
        .video-info-icon {
            width: 60px;
            margin: 0 auto;
            height: 60px;
            padding-top: 15px;
            border-radius: 30px;
            transition: all 0.05s;
            border: 3px solid transparent;
        }
        .video-info-icon i{
            color: #fff;
            font-size: 30px;
        }
        .video-info-btn.active .video-info-icon, .video-info-btn:hover .video-info-icon{
            border:3px solid #f77b05
        }
        .video-info-icon img {
            height: 30px;
            margin: 0 auto;
            display: inline-block;
        }


        .top-info-logo {
            display: inline-block;
            width: 33.33%;
            vertical-align: middle;
        }
        .top-info-date-container {
            display: inline-block;
            font-size: 30px;
            color: #fff;
            width: 33.33%;
            text-align: center;
            vertical-align: middle;
        }
        .top-info-icons-container {
            display: inline-block;
            width: 33.33%;
            text-align: right;
            vertical-align: middle;
        }

        .top-info-time {
            font-size: 24px;
            margin-right: 20px;
            vertical-align: bottom;
            display: inline-block;
            color: #fff;
            font-weight: normal;
        }
        .top-info-date {
            display: inline-block;
            vertical-align: bottom;
            color: #ddd;
            font-size: 24px;
            font-weight: normal;
        }
        .top-info-logo{
            vertical-align: middle;
        }
        .top-info-logo img {
            height: 120px;
        }
        .top-info-icon {
            margin-left: 25px;
            display:inline-block;
            border:2px solid transparent;
            padding: 5px;
            border-radius: 10px;
            transition: all 0.1s;
            vertical-align: middle;
        }
        .top-info-icon.active{
            border-color: #ffff00;
        }
        .top-info-item.active {
            border: 2px solid #ffff00;
        }

        .top-info-icon i{
            color: #fff;
            font-size: 40px;
            vertical-align: middle;
        }
        .top-info-icon img {
            width: 50px;
            padding: 5px;
            border-radius: 5px;
            transition: all 0.1s;
        }
        .top-info-icon.active img{
            /*border: 3px solid #ffae00;*/
        }
        .remove-search-result-btn{
            display: none;
        }
        .search-input-activated .remove-search-result-btn{
            display: inline-block;
        }
        .page-top-info-container {
            white-space: nowrap;
            position: relative;
            padding: 0px 0px;

        }
        .page-top-info-logo-container {
            width: 20%;
            display: inline-block;
            vertical-align: middle;
                float: left;
        }
        .page-top-info-logo-container img {
            height: 70px;
        }
        .page-top-info-btns-container {
            width: 20%;
            display: inline-block;
            vertical-align: middle;
            text-align: right;
                float: right;
        }
        .page-top-info-btn-wrapper {
            display: inline-block;

            vertical-align: middle;
            border: 2px solid transparent;
            padding: 10px;
            border-radius: 5px;
            transition: all 0.05s;

        }
        .page-top-info-btn-wrapper.active{
            border-color: #ffffff;
        }
        .page-top-info-btn {
            height: 50px;
        }
        .page-top-info-title{

            color: #eee;
            font-size:30px;
        }
        .search-input-container{
            position: absolute;
            left: 0;
            right: 200px;
            z-index: 10;

            display: none;
        }
        .search-icons-container{
            position: absolute;
            top:10%;
            left:30px;

        }
        .search-input-wrapper{
            position: relative;
            height: 80px;
        }
        .search-input-icon {
            margin-right: 10px;
            font-size: 35px;
            color: #fff;
            display: inline-block;
            vertical-align: middle;
        }
        .search-input-wrapper-1{
            position: absolute;
            left:200px;
            right:80px;

            height: 80%;
        }
        .top-search-input {
            width: 100%;
            font-size: 30px;
            letter-spacing: 1px;
            font-weight: normal;
            color: #fff;
            padding:10px 5px;
            background: transparent;
            border: 2px solid transparent;
            outline: none !important;
            display: block;
            transition: all 0.05s;
        }
        .top-search-input.active{
            border-color: #fff;
        }

        .search-remove-icon-wrapper{
            position: absolute;
            right:10px;
            font-size:35px;

        }
        .search-input-activated .page-top-info-title{
            display: none;
        }
        .search-input-activated .page-top-search-icon-wrapper{
            /*visibility: hidden;*/
            display: none;
        }
        .search-input-activated .search-input-container{
            display: block;
        }


        .right-top-corner-settings-container{
            position: fixed;
            right: 0;
            top:10px;
            z-index:100;
            background: #fff;
            border-radius: 5px;
            font-size:25px;
            width: 0;
            height: 0;
            transition: none;
        }
        .right-top-corner-settings-container.expanded{
            transition: all 0.3s;
            right:10px;
            width: 520px;
            height: auto;
        }
        .right-top-setting-item{
            border-bottom:1px solid #888;
            white-space: nowrap;
            padding:10px 20px;
            color: #333;
            transition: all 0.1s;
        }
        .right-top-corner-settings-container .right-top-setting-item:last-of-type{
            border-bottom: none;
        }
        .right-top-corner-setting-icon {
            display: inline-block;
            vertical-align: middle;
            width: 60px;
            text-align: center;
            font-size: 30px;
        }
        .right-top-setting-item.active{
            background: #abfdf2;
            /*color: #fff;*/
        }
        .right-top-corner-setting-name{
            display: inline-block;
            vertical-align: middle;
        }
        .right-top-setting-icon-wrapper {
            width: 70px;
            text-align: center;
            display: inline-block;
        }
        .right-top-setting-icon {
            width: 50px;
            height: 50px;
        }


        .setting-modal{
            position: fixed;
            top:0;
            left: 0;
            width: 100%;
            height: 100%;
            background-size: cover;
            background-position: center center;
            display: none;
        }
        .setting-modal * {
            font-weight: normal;
        }
        .setting-modal .fa{
            font-weight: 900;
        }
        .setting-modal-header {
            position: fixed;
            white-space: nowrap;
            width: 90%;
            left: 50%;
            transform: translateX(-50%);
            top:30px;
        }
        .setting-modal-header-part-1 {
            display: inline-block;
            width: 50%;
            vertical-align: middle;
        }
        .setting-modal-header-part-2{
            display: inline-block;
            width: 50%;
            vertical-align: middle;
            text-align: right;
        }
        .setting-modal-header img {
            height: 120px;
        }

        .setting-modal-body{
            color: #fff;
            font-size: 30px;
            margin-left: auto;
            margin-right: auto;
            position: fixed;
            left: 28%;
            top: 30%;

            width: 45%;
        }
        .setting-modal-contents-wrapper{
            background: rgba(76, 76, 77, 0.28);
            border-radius: 10px;
            padding: 20px 50px;
            padding-bottom: 50px;
            padding-top: 10px;
        }
        .setting-modal-title {
            text-align: center;
            font-size: 35px;
            margin-bottom: 20px;
        }
        .setting-modal-input-wrapper input{
            width: 100%;
            padding: 15px;
            background: #8C939A;
            outline: none !important;
            border: 10px solid transparent;
            color: #222;
            font-weight: bold;
            border-radius: 10px;
        }
        .setting-modal-input-wrapper.active input{
            border-color: #fff;
        }
        .setting-modal-label-type-1 {
            margin-top: 20px;
            margin-bottom: 5px;
        }
        .setting-modal-checkbox+label:after{
            top: 10px;
            left: 10px;
            box-sizing: border-box;
            width: 16px;
            height: 23px;
            border-color: #111;
        }
        .setting-modal-checkbox:checked + label:before {
            border: #eee;
            background: #eee;
        }
        .setting-modal-checkbox + label, .setting-modal-checkbox + label{
            padding-left: 70px;
        }
        .setting-option-items-container{
            position: fixed;
            left: 0;
            top:0;
            width: 100%;
            height: 100%;
            z-index:10;
            display: none;
        }

        .setting-modal-btns-container {
            margin-top: 20px;
            white-space: nowrap;
        }
        .setting-modal-btn-wrapper {
            display: inline-block;
            width: 50%;
            padding:0 20px;
        }
        .setting-modal-btn {
            background: #171F28;
            padding: 15px;
            text-align: center;
        }
        .setting-modal-header-logo {
            display: inline-block;
            vertical-align: middle;
        }
        .setting-modal-header-navigation-container {
            color: #fff;
            font-size: 25px;
            display: inline-block;
            vertical-align: middle;
        }
        #setting-modal-header-nav-1,#setting-modal-header-nav-2{
            display: inline-block;
            vertical-align: middle;
        }
        .active-btn-type-1.active{
            /*background: linear-gradient(90deg,#1CA7DF 10%, #21D987 100%);*/
            background: transparent;
            background-image: url('../images/button_2.png');
            background-size: 100% 100%;
        }
        .active-btn-type-2.active{
            /*background: linear-gradient(90deg,#F04055 0%, #E37F33 100%);*/
            background: transparent;
            background-image: url('../images/button_1.png');
            background-size: 100% 100%;
        }

        .setting-modal-radio:checked + label:before{
            border: 4px solid #fff;
        }
        .setting-modal-radio + label:after{
            background: #fff;
        }





        .modal-content{
            display:block !important;
        }
        .modal-dialog {
                position: fixed;
                left: 0;
                right: 0;
                top: 10%;
                margin: auto;
                max-width: 50%;
        }
        .modal-dialog.modal-lg{
            min-width: 850px;
        }
        .modal-dialog.modal-xl{
            min-width: 1000px;
        }
        .video-controls-wrapper{
            margin: 20px auto !important;
            margin-bottom: 0;
            font-size: 0;
            text-align: center;
            width: 80%;
        }

        #video-info-page{
            position: fixed;
            top: 5vh;
            left: 20vw;
            width: 60vw;
            height: 90vh;
            border-radius: 5px;
            overflow: hidden;
            box-shadow: 0 0 30px #68696f;
            background: #efefef;
            color: #222;
            padding:20px;
            display: none;
            z-index: 40;
        }

        .video-progress-bar-type-1-container{
            overflow: hidden;
            background-color: #5B5A5A;
            margin: 5px 0;
            height: 7px;
            position:relative;
        }
        .video-progress-bar-type-1{
            position:absolute;
            height: 100%;
            left:0;
            background: #cc0000;
        }

        .no-wrap{
            white-space: nowrap;
        }
        .btn-wrapper-1{
            width: 50%;
            display: inline-block;
            vertical-align: middle;
        }

        #sort-modal.modal-dialog{
            width: 1000px;
            max-width: 1000px;
        }
        #sort-modal .modal-content{
            padding:0 40px;
        }
        .sort-modal-title {
            color: #111;
            font-size: 35px;
            border-bottom: 2px solid #111;
            padding: 20px 0;
        }
        .sort-modal-title-icon{
            display: inline-block;
            vertical-align: middle;
            font-size: 45px;
        }
        .sort-modal-title-text{
            display: inline-block;
            vertical-align: middle;
            margin-left: 10px;
            font-weight: bold;
        }
        .sort-modal-body {
            padding: 40px 0;
        }
        .sort-modal-item {
            padding: 10px 10px;
            transition: all 0.1s;
            color: #111;
            border-radius: 5px;
        }
        .sort-modal-item.active,.sort-modal-item:hover {
            background: #077b0b;
            color: #fff;
        }
        .sort-modal-item label {
            margin-bottom: 0;
            padding-left:60px;
        }
        .sort-modal-btn-wrapper {
            width: 50%;
            vertical-align: middle;
            display: inline-block;
        }
        .sort-modal-btn {
            background: #333;
            display: inline-block;
            padding: 15px;
            font-size: 35px;
            color: #eee;
            width: 350px;
            text-align: center;
            border-radius: 5px;
            font-weight: normal;
        }
        .sort-modal-btns-container{
            margin-top: 20px;
        }
        .max-line-2{
            overflow: hidden;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            text-overflow: ellipsis;
                line-height: 1;
        }
        .max-line-4{
            overflow: hidden;
            display: -webkit-box;
            -webkit-line-clamp: 4;
            -webkit-box-orient: vertical;
            text-overflow: ellipsis;
        }

        .rangeslider__fill{
            background: #6D66C0 !important;
        }
        @-webkit-keyframes vertical-float-text{
            0%{
                transform: translateY(0);
            }
            100%{
                transform: translateY(-100%);
            }
        }
        .vertical-float-text-wrapper{
            overflow-y: hidden;
            position: relative;
            width: 90%;
        }
        .vertical-float-text{
            position: absolute;
            animation: vertical-float-text infinite linear;
        }

        .video-player-top-part{
            font-size: 25px;
            color: #fff;
            position: fixed;
            display: block;
            left: 0;
            top: 0;
            width: 100%;
            z-index: 10;
            text-align: center;
            padding: 20px 0;
              background: rgb(0 0 0 / 70%);

            display: none;
        }
        .video-top-item-wrapper {
            display: inline-block;
            vertical-align: middle;
            margin: 0 20px;
            padding: 0px;
            z-index: 10;
        }
        .video-top-item {
            font-size: 55px;
            width: 100px;
            height: 100px;
            line-height: 105px;
            border-radius: 50%;
            transition: all 0.05s;
        }
        .video-top-item.active {
            background: #4339bb;
        }
        .current-video-title{
            display: inline-block;
            vertical-align: middle;
            padding: 20px;
            font-size: 30px;
            width: 70%;
            color:#fff;
                text-align: left;
        }
        .modal-bg-white-btn{
            background: #d4cdcd;
            color: #111;
            font-weight: bold;
            text-transform: uppercase;
            font-size: 30px;
            transition: all 0.1s;
            padding: 10px;
        }
        .modal-bg-white-btn.active{
            background: #e586e6;
        }
        #refresh-confirm-modal .modal-content{
            padding:20px 40px;
            width:1000px;
        }
        #refresh-confirm-title {
            font-size: 45px;
            color: #111;
            display: inline-block;
            vertical-align: middle;
            font-weight: bold;
            margin-left:10px;
        }
        .refresh-confirm-btn {
            width: 120px;
        }
        #refresh-confirm-text {
            color: #111;
            font-size: 35px;
        }
        #refresh-confirm-icon-wrapper img{
            height: 50px;
        }
        .loading-backdrop {
            position: fixed;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: #fff;
            z-index: 1000;
            padding:0 40px;
            text-align: center;
            display: none;
        }
        .loading-content-logo-container {
            padding: 30px;
            border-bottom: 2px solid #777;
        }
        .loading-content-rocket-icon {
            display: block;
            margin-left: auto;
            margin-right: auto;
            margin-top: 50px;
            margin-bottom: 80px;
        }
        #loading-content-text-1 {
            color: #111;
            font-size: 30px;
        }
        #loading-content-text-2 {
            font-size: 35px;
            color: #444;
            margin-top: 20px;
            font-weight: bold;
        }
        #loading-content-progress-bar {
            height: 8px;
            background: #E6E3E3;
            position: relative;
            margin-top: 15px;
        }
        #loading-content-progress-amount {
            position: absolute;
            width: 400px;
            background: #9E9494;
            height: 100%;
            animation: loading-content infinite linear 2s;
        }
        #bottom-toast{
            position: fixed;
            z-index: 999;
            left: 38%;
            bottom: 100px;

            display: none;
            opacity: 0;
            transition: all 0.2s;
            background: #605a77;
            padding: 10px 30px;
            border-radius: 30px;
            text-align: center;
            min-width: 200px;
            font-size: 25px;
            white-space: nowrap;
            font-weight: normal;
            color: #fff;
            transition: all 0.2s;
        }
        #bottom-toast.show{
            display: block;
            opacity: 1;
        }
        .bg-yellow{
            background:#ffff00;
        }
        .bg-green{
            background: #00ff00;
        }
        @-webkit-keyframes loading-content{
            0%{
                left:0;
                transform:translateX(-400px);
            }
            100%{
                left:100%;
            }
        }
        #turn-off-modal .modal-body{
            padding: 60px 40px;
            color: #111;
        }
        #turn-off-modal-title {
            font-size: 35px;
            font-weight: bold;
            margin-bottom: 30px;
        }
        #turn-off-modal-btns-container {
            text-align: center;
        }
        .turn-off-modal-btn {
            width: 150px;
            font-size: 25px;
            color: #fff !important;
            background: #111;
        }

        #parent-confirm-modal .modal-body{
            text-align: center;
            color: #111;
            padding:50px;
        }
        #parent-confirm-modal-title {
            font-size: 35px;
            margin-bottom: 20px;
        }
        #parent-confirm-modal .modal-dialog{
            width: 700px !important;
            min-width: unset !important;
        }
        .parent-confirm-modal-button{
            width: 200px;
            background: #111;
            color: #fff;
            font-size: 25px;
        }
        #parent-confirm-password-error{
            text-align: left;
        }
        #parent-confirm-btns-container {
            margin-top: 20px;
        }
        .parent-confirm-modal-button {
            width: 200px;
            background: #111;
            color: #fff !important;
            font-size: 25px;
        }

    }





    @media only screen and (min-width: 1680px) {


            body{
                font-family: 'Lato', sans-serif;
                position: relative;
                overflow: hidden;
                max-width: 1920px;
                margin: 0 auto;
                color:#fff;
                background: #1e1e1e;
            }

            @-webkit-keyframes rotation {
                from {
                    -webkit-transform: rotate(0deg);
                }
                to {
                    -webkit-transform: rotate(360deg);
                }
            }

            .height-100 {
                height: 100vh;
            }
            ::-webkit-scrollbar-corner {
                background-color: transparent;
            }
            ::-webkit-scrollbar {
                width:0px;
                height: 0px;
            }
            ::-webkit-scrollbar-track{
                background: rgba(187, 177, 177, 0.5);
            }


            .hide{
                display: none !important;
            }
            .has-vertical-scroll::-webkit-scrollbar {
                width:14px;
                overflow-y:scroll;
            }
            ::-webkit-scrollbar-thumb {
                background: #8584da;
                border-radius: 10px;
                box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0.05), inset 1px 1px 0px rgba(0, 0, 0, 0.05);
            }


            .category-search-wrapper{
                background: #1B1B1B;
                position: relative;
                padding-left: 50px;
                border:2px solid transparent;
            }
            .category-search-wrapper.active{
                border-color: #fff;
            }
            .category-search-icon {
                position: absolute;
                left: 10px;
                height: 30px;
                top: 30%;
            }
            .category-search-input {
                background: transparent;
                font-size: 25px;
                width: 100%;
                border: none !important;
                padding: 15px 0;
                color: #fff;
                font-weight: normal;
                letter-spacing: 1px;
                outline:none !important;
            }


            .category-item-container {
                font-size: 25px;
                color: #fff;
            }
            .category-item-wrapper{
                white-space: nowrap;
                transition: all 0.03s;
                padding: 10px 10px;
                border-bottom: 2px solid #888;
            }
            .category-item-container:last-child .category-item-wrapper{
                border-bottom: none;
            }
            .category-item-name {
                display: inline-block;
                width: 73%;
                vertical-align: middle;
            }
            .category-movies-count {
                display: inline-block;
                width: 27%;
                text-align: center;
                font-weight: normal;
            }
            .category-item-wrapper.active{
                background:#006172;
            }

            .video-skin{
                position: absolute;
                left:0;
                bottom:0;
                color:#fff;
                width:100%;
                background: #333;
                padding: 10px 0;
                padding-top: 0;
            }
            .video-progress{
                height: 10px;
                overflow: hidden;
                font-size: .75rem;
                background-color: #e9ecef;
            }
            .progress-amount{
                background: #dd0000;
                height: 100px;
                display: inline-block;
            }
            .time-info {
                padding-top: 10px;
                padding-left: 10px;
            }
            .video-loader{
                position:absolute;
                left:0;
                top:0;
                width:100%;
                height: 100%;
                color: #ff4832;
                font-size:25px;
                display:none;
                text-align: center;
            }
            .video-loader img{
                width: 150px;
                height: 150px;
                    position: relative;
                    top: 32%;
            }
            .video-error{
                position: absolute;
                left:0;
                top:0;
                width:100%;
                height: 100%;
                color: #fff;
                font-size:25px;
                display:none;
                text-align: center;
                background: #111;
            }
            .video-error-text{
                font-weight: normal;
            }

            .video-error img {
                width: 100%;
                height: 100%;
            }
            .video-error-text{
                position:relative;
                top:45%;

                white-space: normal;
            }
            .toast{
                position:fixed;
                top:45%;
                left:45%;

                z-index: 9999;
                max-width: none !important;
                display: none;
                box-shadow: none !important;
            }
            .toast-body{
                text-align: center;
            }

            .search-modal-container{
                position: fixed;
                left:0;
                top:0;
                width:100vw;
                height:100vh;
                background: #2222229e;
                display:none;
            }
            .search-modal-wrapper{
                position:fixed;
                width:40vw;
                height: 90vh;
                left:50%;
                top:0;
                transform: translate(-50%, 5vh);
                background: #333;
                padding: 20px 10px;
            }
            .search-input-container{
                font-size: 0;
            }
            #search-value{
                font-size: 25px;
            }
            .search-icon-wrapper{
                color: #eee;
                text-align: right;
                padding: 5px;
                font-size: 25px;
                display: inline-block;
                width: 7%;
            }
            .search-content-container {
                margin-top: 10px;
                height: calc(100vh - 190px);
                overflow-y: scroll;
                padding-bottom: 0;
            }
            .search-item-wrapper {
                color: #ddd;
                font-size: 25px;
                padding: 5px;
                border-bottom: 1px solid #888;
            }
            .search-item-wrapper.active, .search-item-wrapper:hover {
                color: #fff;
                background: #111;
            }

            .favourite-badge {
                position: absolute;
                right: 20px;
                top: 10px;
                font-size: 25px;
                color: yellow;
            }

            .modal-border-1 {
                border: 3px solid #ccc;
            }
            .modal-bg-cyan{
                background: #165a9f !important
            }
            .modal-text-1 {
                font-size: 35px !important;
                color: #eee;
            }
            .modal-btn-1 {
                background: #0f6674 !important;
                padding: 5px 20px !important;
                color: #eee !important;
                font-size: 30px !important;
                border-radius: 10px !important;
                border: 2px solid #ccc !important;
            }
            .modal-btn-1.active {
                border-color: #f1ae0c !important;
                color:#fff !important;
            }

            #app{
                /*background-image: url("../images/black_background.jpg");*/
                background-image: url("../images/dashboard_background.png");
                overflow-y:hidden;
                background-size: 100% 100%;
            }

            #seasons-page-container{
                padding: 30px;
                padding-left: 80px;
                margin-top: 20px;
            }
            #series-image {
                width: 90%;
                max-height:90vh;
            }

            #series-title-container {
                color: #fff;
                margin-bottom: 15px;
            }
            #series-title {
                font-size: 30px;
            }
            #season-rating {
                margin-left: 20px;
                font-size: 25px;
            }
            #season-grid-container{
                height: calc(100vh - 260px);
                padding-top: 15px;
                padding-left:5px;
                padding-bottom:10px;
                overflow-y: hidden;
            }
            .season-grid-item-wrapper, .episode-grid-item-wrapper {
                width: calc(20% - 25px);
                display: inline-block;
                margin-right: 20px;
                border-radius: 10px;
                overflow: hidden;
                height:380px;
                background: #48298f;
                box-shadow: 0 0 5px #633fb5a3;
                transition: all 0.6s;

            }
            .season-grid-item-wrapper.active, .episode-grid-item-wrapper.active{
                background: yellow;
                transform: scale(1.05);
            }
            .season-image, .episode-image {
                width: 100%;
                height: 320px;
                transition: border-color 0.6s;
            }
            .season-grid-item-wrapper.active img, .episode-grid-item-wrapper.active img{
                border-bottom:none;
                border-top-left-radius: 13px;
                border-top-right-radius: 13px;
            }
            .season-title-wrapper, .episode-title-wrapper{
                height: 60px;
                width: 100%;
            }
            .season-title, .episode-title {
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
                color: #fff;
                width:100%;
                text-align: center;
            }
            .season-grid-item-wrapper.active .season-title, .episode-grid-item-wrapper.active .episode-title{
                color:#333;
            }
            #season-title-container {
                color: #fff;
                font-size: 35px;
                margin: 0 auto;
                margin-top: 80px;
            }


            .padding-0{
                padding: 0 !important;
            }

            .modal-header-bg-img-1{
                background-image: url(../images/dialog_title_bg.png);
                background-size: 100% 100%;
                border-bottom: none !important;
            }
            .modal-body-bg-img-1{
                background-image: url(../images/dialog_bg.png);
                background-size: 100% 100%;
            }
            .modal-title-text-2{
                font-size:35px;
                color:#eee;
                margin:5px auto;
            }
            .modal-title-text-3{
                font-size:35px;
                color:#333;
            }



            .modal-operation-menu-type-1 {
                color: #ddd;
                font-size: 35px;
                text-align: center;
                font-weight: bold;
                padding: 15px 25px;
                border-bottom: 1px solid #bfbf96;
            }
            .modal-operation-menu-type-1.active {
                background: #7f2a2a;
            }
            .modal-body .modal-operation-menu-type-1:last-of-type{
                border-bottom:none !important;
            }

            .modal-operation-menu-type-2 {
                padding: 20px 30px;
            }
            .modal-operation-menu-type-2.active {
                background-color: #ddd;
            }
            .modal-btn-2 {
                font-size: 30px;
                width: 150px;
                background: #fff;
                margin-left: 10px;
                transition: all 0.8s;
            }
            .modal-btn-2.active {
                background: #ddd;
            }

            .modal-operation-menu-type-3{
                color: #ddd;
                font-size: 35px;
                font-weight: bold;
                padding: 15px 25px;
            }
            .modal-operation-menu-type-3.active {
                background: #fff;
                color: #333;
                border-radius: 7px;
            }
            .modal-operation-menu-type-3 i {
                margin-right: 20px;
            }
            .modal-operation-menu-type-3.active i {
                color: #4cc94c;
            }

            .parent-modal-input-item-container {
                font-size: 35px;
                margin-bottom: 10px;
            }
            .parent-modal-label-wrapper{
                color: #fff;
                display: inline-block;
                width: 41%;
                vertical-align: middle;
            }
            .parent-modal-input-wrapper {
                padding-right: 0;
            }
            .parent-modal-input-wrapper input {
                padding: 20px 10px;
                font-size: 30px;
                border: 3px solid #a99e9e;
            }
            .parent-modal-input-wrapper.active input{
                border: 3px solid #e87b0a !important;
            }

            .parent-modal-input-container {
                margin-top:10px;
                margin-bottom: 100px;
            }

            .user-account-item-wrapper.row {
                font-size: 35px;
                color: #f78d0b;
            }
            .no-background{
                background: none !important;
            }
            .active-state{
                background: #c81111;
            }
            .subtitle-container{
                color:#fff;
                font-size:35px;
                font-weight: normal;
                bottom:0;
                padding:30px;
                width:60%;
                left:20%;
            }
            .login-page-link {
                color: #ffff00 !important;
            }

            #sort-modal-container{
                position: fixed;
                left:0;
                top:0;
                width: 100%;
                height: 100%;
                background: #1119;
                display: none;
            }
            #sort-modal-wrapper{
                position: absolute;
                left: 35%;
                top: 150px;
                font-size: 30px;
                border-radius: 5px;
            }


            .video-info-btns-container{
                font-size: 0;
                width: 80%;
                margin: 0 auto;
            }
            .video-info-btn {
                vertical-align: middle;
                display: inline-block;
                text-align: center;
                width: 25%;
            }
            .video-info-icon {
                width: 60px;
                margin: 0 auto;
                height: 60px;
                padding-top: 15px;
                border-radius: 30px;
                transition: all 0.05s;
                border: 3px solid transparent;
            }
            .video-info-icon i{
                color: #fff;
                font-size: 30px;
            }
            .video-info-btn.active .video-info-icon, .video-info-btn:hover .video-info-icon{
                border:3px solid #f77b05
            }
            .video-info-icon img {
                height: 30px;
                margin: 0 auto;
                display: inline-block;
            }


            .top-info-logo {
                display: inline-block;
                width: 33.33%;
                vertical-align: middle;
            }
            .top-info-date-container {
                display: inline-block;
                font-size: 30px;
                color: #fff;
                width: 33.33%;
                text-align: center;
                vertical-align: middle;
            }
            .top-info-icons-container {
                display: inline-block;
                width: 33.33%;
                text-align: right;
                vertical-align: middle;
            }

            .top-info-time {
                font-size: 35px;
                margin-right: 20px;
                vertical-align: bottom;
                display: inline-block;
                color: #fff;
                font-weight: normal;
            }
            .top-info-date {
                display: inline-block;
                vertical-align: bottom;
                color: #ddd;
                font-size: 30px;
                font-weight: normal;
            }
            .top-info-logo{
                vertical-align: middle;
            }
            .top-info-logo img {
                height: 120px;
            }
            .top-info-icon {
                margin-left: 70px;
                display:inline-block;
                border:2px solid transparent;
                padding:10px;
                border-radius: 10px;
                transition: all 0.1s;
                vertical-align: middle;
            }
            .top-info-icon.active{
                border-color: #ffff00;
            }
            .top-info-item.active {
                border: 2px solid #ffff00;
            }

            .top-info-icon i{
                color: #fff;
                font-size: 40px;
                vertical-align: middle;
            }
            .top-info-icon img {
                width: 60px;
                padding:5px;
                border-radius: 5px;
                transition: all 0.1s;
            }
            .top-info-icon.active img{
                /*border: 3px solid #ffae00;*/
            }
            .remove-search-result-btn{
                display: none;
            }
            .search-input-activated .remove-search-result-btn{
                display: inline-block;
            }
            .page-top-info-container {
                white-space: nowrap;
                position: relative;
                padding:25px 20px;

            }
            .page-top-info-logo-container {
                width: 20%;
                display: inline-block;
                vertical-align: middle;
                    float: left;
            }
            .page-top-info-logo-container img {
                height: 70px;
            }
            .page-top-info-btns-container {
                width: 20%;
                display: inline-block;
                vertical-align: middle;
                text-align: right;
                    float: right;
            }
            .page-top-info-btn-wrapper {
                display: inline-block;

                vertical-align: middle;
                border: 2px solid transparent;
                padding: 10px;
                border-radius: 5px;
                transition: all 0.05s;

            }
            .page-top-info-btn-wrapper.active{
                border-color: #ffffff;
            }
            .page-top-info-btn {
                height: 50px;
            }
            .page-top-info-title{

                color: #eee;
                font-size:35px;
            }
            .search-input-container{
                position: absolute;
                left: 0;
                right: 200px;
                z-index: 10;

                display: none;
            }
            .search-icons-container{
                position: absolute;
                top:10%;
                left:30px;

            }
            .search-input-wrapper{
                position: relative;
                height: 80px;
            }
            .search-input-icon {
                margin-right: 10px;
                font-size: 35px;
                color: #fff;
                display: inline-block;
                vertical-align: middle;
            }
            .search-input-wrapper-1{
                position: absolute;
                left:200px;
                right:80px;

                height: 80%;

            }
            .top-search-input {
                width: 100%;
                font-size: 30px;
                letter-spacing: 1px;
                font-weight: normal;
                color: #fff;
                padding:10px 5px;
                background: transparent;
                border: 2px solid transparent;
                outline: none !important;
                display: block;
                transition: all 0.05s;
            }
            .top-search-input.active{
                border-color: #fff;
            }

            .search-remove-icon-wrapper{
                position: absolute;
                right:10px;
                font-size:35px;

            }
            .search-input-activated .page-top-info-title{
                display: none;
            }
            .search-input-activated .page-top-search-icon-wrapper{
                /*visibility: hidden;*/
                display: none;
            }
            .search-input-activated .search-input-container{
                display: block;
            }


            .right-top-corner-settings-container{
                position: fixed;
                right: 0;
                top:10px;
                z-index:100;
                background: #fff;
                border-radius: 5px;
                font-size:25px;
                width: 0;
                height: 0;
                transition: none;
            }
            .right-top-corner-settings-container.expanded{
                transition: all 0.3s;
                right:10px;
                width: 520px;
                height: auto;
            }
            .right-top-setting-item{
                border-bottom:1px solid #888;
                white-space: nowrap;
                padding:10px 20px;
                color: #333;
                transition: all 0.1s;
            }
            .right-top-corner-settings-container .right-top-setting-item:last-of-type{
                border-bottom: none;
            }
            .right-top-corner-setting-icon {
                display: inline-block;
                vertical-align: middle;
                width: 60px;
                text-align: center;
                font-size: 30px;
            }
            .right-top-setting-item.active{
                background: #abfdf2;
                /*color: #fff;*/
            }
            .right-top-corner-setting-name{
                display: inline-block;
                vertical-align: middle;
            }
            .right-top-setting-icon-wrapper {
                width: 70px;
                text-align: center;
                display: inline-block;
            }
            .right-top-setting-icon {
                width: 50px;
                height: 50px;
            }


            .setting-modal{
                position: fixed;
                top:0;
                left: 0;
                width: 100%;
                height: 100%;
                background-size: cover;
                background-position: center center;
                display: none;
            }
            .setting-modal * {
                font-weight: normal;
            }
            .setting-modal .fa{
                font-weight: 900;
            }
            .setting-modal-header {
                position: fixed;
                white-space: nowrap;
                width: 90%;
                left: 50%;
                transform: translateX(-50%);
                top:30px;
            }
            .setting-modal-header-part-1 {
                display: inline-block;
                width: 50%;
                vertical-align: middle;
            }
            .setting-modal-header-part-2{
                display: inline-block;
                width: 50%;
                vertical-align: middle;
                text-align: right;
            }
            .setting-modal-header img {
                height: 120px;
            }

            .setting-modal-body{
                color: #fff;
                font-size: 30px;
                margin-left: auto;
                margin-right: auto;
                position: fixed;
                left: 28%;
                top: 30%;

                width: 45%;
            }
            .setting-modal-contents-wrapper{
                background: rgba(76, 76, 77, 0.28);
                border-radius: 10px;
                padding: 20px 50px;
                padding-bottom: 50px;
                padding-top: 30px;
            }
            .setting-modal-title {
                text-align: center;
                font-size: 35px;
                margin-bottom: 20px;
            }
            .setting-modal-input-wrapper input{
                width: 100%;
                padding: 15px;
                background: #8C939A;
                outline: none !important;
                border: 10px solid transparent;
                color: #222;
                font-weight: bold;
                border-radius: 10px;
            }
            .setting-modal-input-wrapper.active input{
                border-color: #fff;
            }
            .setting-modal-label-type-1 {
                margin-top: 20px;
                margin-bottom: 5px;
            }
            .setting-modal-checkbox+label:after{
                top: 10px;
                left: 10px;
                box-sizing: border-box;
                width: 16px;
                height: 23px;
                border-color: #111;
            }
            .setting-modal-checkbox:checked + label:before {
                border: #eee;
                background: #eee;
            }
            .setting-modal-checkbox + label, .setting-modal-checkbox + label{
                padding-left: 70px;
            }
            .setting-option-items-container{
                position: fixed;
                left: 0;
                top:0;
                width: 100%;
                height: 100%;
                z-index:10;
                display: none;
            }

            .setting-modal-btns-container {
                margin-top: 20px;
                white-space: nowrap;
            }
            .setting-modal-btn-wrapper {
                display: inline-block;
                width: 50%;
                padding:0 20px;
            }
            .setting-modal-btn {
                background: #171F28;
                padding: 15px;
                text-align: center;
            }
            .setting-modal-header-logo {
                display: inline-block;
                vertical-align: middle;
            }
            .setting-modal-header-navigation-container {
                color: #fff;
                font-size: 25px;
                display: inline-block;
                vertical-align: middle;
            }
            #setting-modal-header-nav-1,#setting-modal-header-nav-2{
                display: inline-block;
                vertical-align: middle;
            }
            .active-btn-type-1.active{
                /*background: linear-gradient(90deg,#1CA7DF 10%, #21D987 100%);*/
                background: transparent;
                background-image: url('../images/button_2.png');
                background-size: 100% 100%;
            }
            .active-btn-type-2.active{
                /*background: linear-gradient(90deg,#F04055 0%, #E37F33 100%);*/
                background: transparent;
                background-image: url('../images/button_1.png');
                background-size: 100% 100%;
            }

            .setting-modal-radio:checked + label:before{
                border: 4px solid #fff;
            }
            .setting-modal-radio + label:after{
                background: #fff;
            }





            .modal-content{
                display:block !important;
            }
            .modal-dialog {
                    position: fixed;
                    left: 0;
                    right: 0;
                    top: 10%;
                    margin: auto;
                    max-width: 50%;
            }
            .modal-dialog.modal-lg{
                min-width: 850px;
            }
            .modal-dialog.modal-xl{
                min-width: 1000px;
            }
            .video-controls-wrapper{
                margin: 20px auto !important;
                margin-bottom: 0;
                font-size: 0;
                text-align: center;
                width: 80%;
            }

            #video-info-page{
                position: fixed;
                top: 5vh;
                left: 20vw;
                width: 60vw;
                height: 90vh;
                border-radius: 5px;
                overflow: hidden;
                box-shadow: 0 0 30px #68696f;
                background: #efefef;
                color: #222;
                padding:20px;
                display: none;
                z-index: 40;
            }

            .video-progress-bar-type-1-container{
                overflow: hidden;
                background-color: #5B5A5A;
                margin: 5px 0;
                height: 7px;
                position:relative;
            }
            .video-progress-bar-type-1{
                position:absolute;
                height: 100%;
                left:0;
                background: #cc0000;
            }

            .no-wrap{
                white-space: nowrap;
            }
            .btn-wrapper-1{
                width: 50%;
                display: inline-block;
                vertical-align: middle;
            }

            #sort-modal.modal-dialog{
                width: 1000px;
                max-width: 1000px;
            }
            #sort-modal .modal-content{
                padding:0 40px;
            }
            .sort-modal-title {
                color: #111;
                font-size: 35px;
                border-bottom: 2px solid #111;
                padding: 20px 0;
            }
            .sort-modal-title-icon{
                display: inline-block;
                vertical-align: middle;
                font-size: 45px;
            }
            .sort-modal-title-text{
                display: inline-block;
                vertical-align: middle;
                margin-left: 10px;
                font-weight: bold;
            }
            .sort-modal-body {
                padding: 40px 0;
            }
            .sort-modal-item {
                padding: 10px 10px;
                transition: all 0.1s;
                color: #111;
                border-radius: 5px;
            }
            .sort-modal-item.active,.sort-modal-item:hover {
                background: #077b0b;
                color: #fff;
            }
            .sort-modal-item label {
                margin-bottom: 0;
                padding-left:60px;
            }
            .sort-modal-btn-wrapper {
                width: 50%;
                vertical-align: middle;
                display: inline-block;
            }
            .sort-modal-btn {
                background: #333;
                display: inline-block;
                padding: 15px;
                font-size: 35px;
                color: #eee;
                width: 350px;
                text-align: center;
                border-radius: 5px;
                font-weight: normal;
            }
            .sort-modal-btns-container{
                margin-top: 20px;
            }
            .max-line-2{
                overflow: hidden;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                text-overflow: ellipsis;
            }
            .max-line-4{
                overflow: hidden;
                display: -webkit-box;
                -webkit-line-clamp: 4;
                -webkit-box-orient: vertical;
                text-overflow: ellipsis;
            }

            .rangeslider__fill{
                background: #6D66C0 !important;
            }
            @-webkit-keyframes vertical-float-text{
                0%{
                    transform: translateY(0);
                }
                100%{
                    transform: translateY(-100%);
                }
            }
            .vertical-float-text-wrapper{
                overflow-y: hidden;
                position: relative;
                width: 90%;
            }
            .vertical-float-text{
                position: absolute;
                animation: vertical-float-text infinite linear;
            }

            .video-player-top-part{
                font-size: 25px;
                color: #fff;
                position: fixed;
                display: block;
                left: 0;
                top: 0;
                width: 100%;
                z-index: 10;
                text-align: center;
                padding: 20px 0;
                    background: rgb(0 0 0 / 70%);

                display: none;
            }
            .video-top-item-wrapper {
                display: inline-block;
                vertical-align: middle;
                margin: 0 20px;
                padding: 0px;
                z-index: 10;
            }
            .video-top-item {
                font-size: 55px;
                width: 100px;
                height: 100px;
                line-height: 105px;
                border-radius: 50%;
                transition: all 0.05s;
            }
            .video-top-item.active {
                background: #4339bb;
            }
            .current-video-title{
                display: inline-block;
                vertical-align: middle;
                padding: 20px;
                font-size: 40px;
                width: 80%;
                color:#fff;
                    text-align: left;
            }
            .modal-bg-white-btn{
                background: #d4cdcd;
                color: #111;
                font-weight: bold;
                text-transform: uppercase;
                font-size: 30px;
                transition: all 0.1s;
                padding: 10px;
            }
            .modal-bg-white-btn.active{
                background: #e586e6;
            }
            #refresh-confirm-modal .modal-content{
                padding:20px 40px;
                width:1000px;
            }
            #refresh-confirm-title {
                font-size: 45px;
                color: #111;
                display: inline-block;
                vertical-align: middle;
                font-weight: bold;
                margin-left:10px;
            }
            .refresh-confirm-btn {
                width: 120px;
            }
            #refresh-confirm-text {
                color: #111;
                font-size: 35px;
            }
            #refresh-confirm-icon-wrapper img{
                height: 50px;
            }
            .loading-backdrop {
                position: fixed;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                background: #fff;
                z-index: 1000;
                padding:0 40px;
                text-align: center;
                display: none;
            }
            .loading-content-logo-container {
                padding: 30px;
                border-bottom: 2px solid #777;
            }
            .loading-content-rocket-icon {
                display: block;
                margin-left: auto;
                margin-right: auto;
                margin-top: 50px;
                margin-bottom: 80px;
            }
            #loading-content-text-1 {
                color: #111;
                font-size: 30px;
            }
            #loading-content-text-2 {
                font-size: 35px;
                color: #444;
                margin-top: 20px;
                font-weight: bold;
            }
            #loading-content-progress-bar {
                height: 8px;
                background: #E6E3E3;
                position: relative;
                margin-top: 15px;
            }
            #loading-content-progress-amount {
                position: absolute;
                width: 400px;
                background: #9E9494;
                height: 100%;
                animation: loading-content infinite linear 2s;
            }
            #bottom-toast{
                position: fixed;
                z-index: 999;
                left: 38%;
                bottom: 100px;

                display: none;
                opacity: 0;
                transition: all 0.2s;
                background: #605a77;
                padding: 10px 30px;
                border-radius: 30px;
                text-align: center;
                min-width: 200px;
                font-size: 25px;
                white-space: nowrap;
                font-weight: normal;
                color: #fff;
                transition: all 0.2s;
            }
            #bottom-toast.show{
                display: block;
                opacity: 1;
            }
            .bg-yellow{
                background:#ffff00;
            }
            .bg-green{
                background: #00ff00;
            }
            @-webkit-keyframes loading-content{
                0%{
                    left:0;
                    transform:translateX(-400px);
                }
                100%{
                    left:100%;
                }
            }
            #turn-off-modal .modal-body{
                padding: 60px 40px;
                color: #111;
            }
            #turn-off-modal-title {
                font-size: 35px;
                font-weight: bold;
                margin-bottom: 30px;
            }
            #turn-off-modal-btns-container {
                text-align: center;
            }
            .turn-off-modal-btn {
                width: 150px;
                font-size: 25px;
                color: #fff !important;
                background: #111;
            }

            #parent-confirm-modal .modal-body{
                text-align: center;
                color: #111;
                padding:50px;
            }
            #parent-confirm-modal-title {
                font-size: 35px;
                margin-bottom: 20px;
            }
            #parent-confirm-modal .modal-dialog{
                width: 700px !important;
                min-width: unset !important;
            }
            .parent-confirm-modal-button{
                width: 200px;
                background: #111;
                color: #fff;
                font-size: 25px;
            }
            #parent-confirm-password-error{
                text-align: left;
            }
            #parent-confirm-btns-container {
                margin-top: 20px;
            }
            .parent-confirm-modal-button {
                width: 200px;
                background: #111;
                color: #fff !important;
                font-size: 25px;
            }
    }

    #clear-cache-modal .modal-body{
        padding: 60px 40px;
        color: #111;
    }
    #clear-cache-modal-title {
        font-size: 28px;

        margin-bottom: 30px;
    }
    #clear-cache-modal-btns-container {
        text-align: center;
    }
    .clear-cache-modal-btn {
        width: 150px;
        font-size: 25px;
        color: #fff !important;
        background: #111;
    }