.film_navbar{padding: 15px 15px 18px 15px;}
.film_navbar > div{display: table; table-layout: fixed; width: 100%;}
.film_navbar > div > div{display: table-cell; vertical-align: middle;}
.film_navbar > div > div:first-child{width: 23px; padding-right: 25px; display: none;}
.film_navbar > div > div:first-child > div{width: 20px; height: 20px; cursor: pointer;}
.film_navbar > div > div:nth-child(2){width: 120px;}
.film_navbar > div > div:nth-child(2) > div{width: 120px; height: 23px;}
.film_navbar > div > div:nth-child(3){padding-left: 20px; color: var(--text_white); font-size: 15px;}
.film_navbar > div > div:nth-child(4) > div{float: right; padding: 10px 30px; text-align: center; border-radius: 5px; background: #333333;}
.film_navbar > div > div:nth-child(4) > div > div:first-child{font-size: 11px; color: #929292;}
.film_navbar > div > div:nth-child(4) > div > div:nth-child(2){margin-top: 3px; font-family: 'bold'; color: var(--text_white);}

.film_klikfilm_logo_player{position: relative; height: 0px; width: 100%;}
.film_klikfilm_logo_player > div{width: 118px; height: 22px; position: absolute; top: 35px; right: 45px; z-index: 55; opacity: 0.7;}
.film_klikfilm_logo_player > div:hover{opacity: 1;}

.film_section{background: var(--bg_black); padding: 0px 0px 65px 0px;}
.film_section > div:first-child{margin-bottom: 15px; padding-top: 8px;}
.film_section .title > div:first-child > div{color: var(--text_white);}
.film_section .title a{color: var(--text_white);}
.film_section .card_hzl_film .cnt_card > a:first-child > div{margin-left: 35px;}
.film_section .card_hzl_film .cnt_card > a:last-child > div{margin-right: 35px;}

.film_trending{margin-top: -115px;}
/* .film_trending{margin-top: 13px;} */
.film_trending > div:first-child{font-size: 30px; margin-left: 25px; margin-bottom: 10px; font-family: 'bold'; letter-spacing: 8px; text-shadow: 0px 0px 10px black;}
.film_trending > div:nth-child(2){}

.film_premiere{padding: 15px 0px 16px 0px; background: var(--bg_red); color: var(--text_white);}
.film_premiere .fp_box{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; grid-gap: 20px;}
.film_premiere .fp_box > div{width: 100%; position: relative; border-radius: 7px; overflow: hidden;}
.film_premiere .fp_box > div > div:first-child{padding-bottom: 143%; background-color: var(--bg_silvercalm);}
.film_premiere .fp_box > div > div:nth-child(2){position: absolute; width: 100%; bottom: 0px; left: 0px; opacity: 0; transition:all 0.2s ease;}
.film_premiere .fp_box > div:hover > div:nth-child(2){opacity: 1;}
.film_premiere .fp_box > div > div:nth-child(2) > a > div{padding: 15px 0px; text-align: center; background: var(--bg_black); font-family: 'bold'; color: var(--text_white);}

.film_cinema_box{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 35px; margin-bottom: 35px; margin-top: 15px;}
.film_cinema_box > div{width: 100%;}
.film_cinema_box > div > div:first-child{text-align: center; padding-bottom: 25px; padding-top: 10px; font-size: 17px; font-family: 'bold'; color: var(--text_white);}
.film_cinema_box > div > div:nth-child(2){padding-bottom: 150%; background-color: var(--bg_black); border-radius: 10px; cursor: pointer;}
.film_cinema_box > div > div:nth-child(3){margin-top: 15px; color: var(--text_white); text-align: center;}
.film_cinema_box > div > div:nth-child(3) span{padding: 5px 15px; border-radius: 50px; background: var(--bg_red); color: var(--text_white);}
.film_cinema_box > div > div:nth-child(4){margin-top: 15px;}

.film_highlight{padding: 15px 0px 50px 0px; background: var(--bg_black);}
.film_highlight .fc_box{display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 20px;}
.film_highlight .fc_box > div{height: 200px; border-radius: 10px; cursor: pointer;}
.film_highlight .fc_box > div:first-child{background-image: linear-gradient(to bottom, #217994, #80c7cb);}
.film_highlight .fc_box > div:nth-child(2){background-image: linear-gradient(to bottom, #fae5aa, #da855b);}
.film_highlight .fc_box > div:nth-child(3){background-image: linear-gradient(to bottom, #6a3da8, #983bba);}
.film_highlight .fc_box > div > div{padding: 20px 25px;}
.film_highlight .fc_box > div > div > div{display: table; table-layout: fixed; width: 100%;}
.film_highlight .fc_box > div > div > div > div{display: table-cell; vertical-align: top;}
.film_highlight .fc_box > div > div > div > div:first-child{width: 110px;}
.film_highlight .fc_box > div > div > div > div:first-child > div{height: 160px; background-color: var(--bg_white); border-radius: 5px;}
.film_highlight .fc_box > div > div > div > div:nth-child(2){padding-left: 15px; color: var(--text_white);}
.film_highlight .fc_box > div > div > div > div:nth-child(2) > div:first-child{font-size: 17px; font-family: 'bold';}
.film_highlight .fc_box > div > div > div > div:nth-child(2) > div:nth-child(2){margin-top: 10px; white-space: normal; overflow: hidden;}

.film_cinema_layout{}
.film_cinema_layout > div{display: inline-block; width: 100%;}
.film_cinema_layout > div > div:first-child{width: 330px; float: right;}
.film_cinema_layout > div > div:nth-child(2){width: calc(100% - 330px); float: left; transition: all 1s ease;}
.film_cinema_layout .fcl_screen > div:first-child{}
.film_cinema_layout .fcl_screen > div:nth-child(2){width: 100%; height: 0px; position: relative;}
.film_cinema_layout .fcl_screen > div:nth-child(2) > canvas{position: absolute; bottom: 100px; right: 0px; display: none;}
.film_cinema_layout .fcl_screen .fcls_player{background: red;}
.film_cinema_layout .fcl_screen .fcls_player .fclsp_video{position: relative; width: 100%; height: calc(100vh - 100px);}
.film_cinema_layout .fcl_screen .fcls_player .fclsp_video .video-js {
    height: 100% !important; 
    width: 100% !important;
    position: absolute;
    top: 0;
    left: 0;
}
.film_cinema_layout.fullscreen .fcl_screen .fcls_player .fclsp_video{height: 100vh;}
.film_cinema_layout.fullscreen .film_chat > div{grid-template-rows: 0px 41px 1fr 60px;}
.film_cinema_layout.withoutchat > div > div:nth-child(2){width: 100%; float: unset;}

.film_chat{position: fixed; width: 330px; height: 100%; background: #111113; top: 0px;}
.film_chat > div{display: grid; height: 100%; position: absolute; width: 100%; grid-template-rows: 100px 41px 1fr 60px;}
.film_chat > div > div{width: 100%;}
.film_chat > div > div:first-child{}
.film_chat > div > div:nth-child(2){position: relative;}
.film_chat > div > div:nth-child(2) > div:first-child{font-size: 17px; font-family: 'bold'; color: var(--text_white); text-align: center; padding-top: 8px; border: 2px solid var(--bg_line); padding-bottom: 6px;}
.film_chat > div > div:nth-child(2) > div:nth-child(2){position: absolute; top: 10px; right: 10px; width: 20px; height: 20px; cursor: pointer; display: none;}
.film_chat > div > div:nth-child(3){position: relative;}
.film_chat > div > div:nth-child(3) > div{position: absolute; width: 100%; height: 100%; overflow: auto;}
.film_chat > div > div:nth-child(4){background: var(--bg_silvercalm);}
.film_chat .tc_bubble{padding: 10px 0px;}
.film_chat .tc_bubble > div{padding: 3px 20px; color: var(--text_silver);}
.film_chat .tc_input{padding: 12px 14px;}
.film_chat .tc_input > div{display: table; table-layout: fixed; width: 100%;}
.film_chat .tc_input > div > div{display: table-cell; vertical-align: middle;}
.film_chat .tc_input > div > div:first-child{width: 40px;}
.film_chat .tc_input input{background: var(--bg_white);}
.film_chat .tc_login{padding: 15px;}
.film_chat .tc_love{height: 25px; width: 25px; cursor: pointer; float: left;}
.film_chat .tc_love > div{height: 25px; width: 25px;}
.film_chat .tc_love:hover > div{transform: scale(1.5);}
.film_chat .tc_love:active > div{transform: scale(0.5);}

.film_chat_mini{position: fixed; right: -100%; top: 70px; padding: 5px 10px 6px 15px; z-index: 40; background: var(--bg_red); border-radius: 50px 0px 0px 50px; display: none;}
.film_chat_mini > div{width: 20px; height: 20px;}

.film_detail_simple{width: 500px; margin-top: 50px; margin-bottom: 70px;}
.film_detail_simple .fds_head{display: table; table-layout: fixed; width: 100%;}
.film_detail_simple .fds_head > div{display: table-cell; vertical-align: top; color: var(--text_silver);}
.film_detail_simple .fds_head > div:first-child{width: 100px;}
.film_detail_simple .fds_head > div:first-child > div{padding-bottom: 150%; background-color: var(--bg_black); border-radius: 5px;}
.film_detail_simple .fds_head > div:nth-child(2){padding-left: 25px;}
.film_detail_simple .fds_head > div:nth-child(2) > div:first-child{font-size: 17px; font-family: 'bold';}
.film_detail_simple .fds_head > div:nth-child(2) > div:nth-child(2){margin-top: 10px;}
.film_detail_simple .fds_head .fdsh_count{display: inline-block; width: 100%;}
.film_detail_simple .fds_head .fdsh_count > div{float: left; padding: 5px 0px; width: 70px; background: var(--bg_silvercalm); border-radius: 5px; margin-right: 15px; text-align: center;}
.film_detail_simple .fds_head .fdsh_count > div > div:first-child{font-family: 'bold'; color: var(--text_black);}
.film_detail_simple .fds_head .fdsh_count > div > div:last-child{font-size: 11px;}

.film_buying{padding: 15px 0px; color: var(--text_black);}
.film_buying > div:first-child{padding: 0px 15px; font-size: 17px; font-family: 'bold';}
.film_buying > div:nth-child(2){padding: 0px 15px; margin-top: 5px;}
.film_buying > div:nth-child(3){margin: 25px 0px;}
.film_buying > div:nth-child(3) > div{padding: 15px 15px; cursor: pointer; border-top: 1px solid var(--bg_line);}
.film_buying > div:nth-child(3) > div:hover{background: var(--bg_silvercalm);}
.film_buying > div:nth-child(3) > div:last-child{border-bottom: 1px solid var(--bg_line);}
.film_buying > div:nth-child(3) > div > div{display: table; table-layout: fixed; width: 100%;}
.film_buying > div:nth-child(3) > div > div > div{display: table-cell; vertical-align: middle;}
.film_buying > div:nth-child(3) > div > div > div:first-child > img{height: 20px;}
.film_buying > div:nth-child(3) > div > div > div:last-child{text-align: right; font-family: 'bold'; color: var(--text_red);}
.film_buying > div:nth-child(4){padding: 0px 15px;}